fix deleting hopefully

diff --git a/Builder/About.bjs b/Builder/About.bjs
new file mode 100644 (file)
index 0000000..a304008
--- /dev/null
+++ b/Builder/About.bjs
@@ -0,0 +1,24 @@
+{
+    "id": "file-gtk-8",
+    "name": "About",
+    "parent": "",
+    "title": false,
+    "path": "/home/alan/gitlive/app.Builder.js/Sample/About.bjs",
+    "items": [
+        {
+            "listeners": {
+                "response": "function (self, response_id) {\n    this.el.hide();\n}",
+                "delete_event": "function (self, event) {\n    this.el.hide();\n    return true;\n}"
+            },
+            "authors": "Alan Knowles",
+            "copyright": "LGPL",
+            "license": "LGPL",
+            "program_name": "app.Builder.js",
+            "website": "http://www.akbkhome.com/blog.php",
+            "xtype": "AboutDialog",
+            "|modal": true,
+            "|xns": "Gtk"
+        }
+    ],
+    "permname": ""
+}
\ No newline at end of file

diff --git a/Builder/About.js b/Builder/About.js
new file mode 100644 (file)
index 0000000..ee29392
--- /dev/null
+++ b/Builder/About.js
@@ -0,0 +1,32 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+About=new XObject({
+    xtype: Gtk.AboutDialog,
+    listeners : {
+        response : function (self, response_id) {
+            this.el.hide();
+        },
+        delete_event : function (self, event) {
+            this.el.hide();
+            return true;
+        }
+    },
+    authors : "Alan Knowles",
+    copyright : "LGPL",
+    license : "LGPL",
+    program_name : "app.Builder.js",
+    website : "http://www.akbkhome.com/blog.php",
+    modal : true
+});
+About.init();
+XObject.cache['/About'] = About;

diff --git a/Builder/DialogConfirm.js b/Builder/DialogConfirm.js
new file mode 100644 (file)
index 0000000..c346270
--- /dev/null
+++ b/Builder/DialogConfirm.js
@@ -0,0 +1,46 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+DialogConfirm=new XObject({
+    xtype: Gtk.MessageDialog,
+    show : function(msg, success) {
+         if (!this.el) {
+                this.init();
+            }
+         this.success = success;
+            this.el.text =  msg;
+            this.el.show_all();
+    
+    },
+    buttons : Gtk.ButtonsType.YES_NO,
+    title : "Please Confirm",
+    message_type : Gtk.MessageType.QUESTION,
+    use_markup : true,
+    text : "-",
+    modal : true,
+    listeners : {
+        response : function (self, response_id) {
+           this.el.hide();
+        print("RESPOSE: " + response_id);
+            if (response_id == -8) { //yes!
+           print("CALL SUCCES?")
+              this.success();
+            }
+        },
+        delete_event : function (self, event) {
+            this.el.hide();
+            return true;
+        }
+    }
+});
+DialogConfirm.init();
+XObject.cache['/DialogConfirm'] = DialogConfirm;

diff --git a/Builder/EditProject.js b/Builder/EditProject.js
new file mode 100644 (file)
index 0000000..5f772c5
--- /dev/null
+++ b/Builder/EditProject.js
@@ -0,0 +1,184 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+EditProject=new XObject({
+    xtype: Gtk.Dialog,
+    default_height : 500,
+    default_width : 600,
+    deletable : true,
+    modal : true,
+    border_width : 3,
+    title : "Project Properties",
+    show : function(c) {
+           c = c || { name : '' , xtype : '' };
+        this.project  = c;
+        if (!this.el) {
+            this.init();
+        }
+        var _this = this;
+        [ 'xtype'  ].forEach(function(k) {
+            _this.get(k).setValue(typeof(c[k]) == 'undefined' ? '' : c[k]);
+        });
+       // shouild set path..
+        
+        this.el.show_all();
+        this.success = c.success;
+    },
+    listeners : {
+        destroy_event : function (self, event) {
+             this.el.hide();
+                        return false;
+        },
+        response : function (self, id) {
+         if (id < 1) {
+                    this.el.hide();
+                    return;
+                }
+                if (!this.get('xtype').getValue().length) {
+                    this.get('/StandardErrorDialog').show("You have to set Project type");             
+                    return;
+                }
+                if (!this.get('dir').el.get_filename().length) {
+                    this.get('/StandardErrorDialog').show("You have to select a folder");             
+                    return;
+                }
+        
+                this.el.hide();
+                
+                
+                var fn = this.get('dir').el.get_filename();
+                
+                this.project.name  = GLib.basename(fn);
+                this.project.xtype  = this.get('xtype').getValue();
+                this.project.paths = {};
+                this.project.paths[fn] =  'dir' ;
+                
+                var pr = imports.Builder.Provider.ProjectManager.ProjectManager.update(this.project);
+                
+                this.success(pr);
+                Seed.print(id);
+        }
+    },
+    items : [
+        {
+            xtype: Gtk.VBox,
+            pack : function(p,e) {
+                        p.el.get_content_area().add(e.el)
+                    },
+            items : [
+                {
+                    xtype: Gtk.HBox,
+                    pack : "pack_start,false,true,3",
+                    items : [
+                        {
+                            xtype: Gtk.Label,
+                            pack : "pack_start,false,true,3",
+                            label : "Project type :"
+                        },
+                        {
+                            xtype: Gtk.ComboBox,
+                            pack : "pack_end,true,true,3",
+                            id : "xtype",
+                            setValue : function(v)
+                                            {
+                                                var el = this.el;
+                                                el.set_active(-1);
+                                                this.get('model').data.forEach(function(n, ix) {
+                                                    if (v == n.xtype) {
+                                                        el.set_active(ix);
+                                                        return false;
+                                                    }
+                                                });
+                                            },
+                            getValue : function() {
+                                 var ix = this.el.get_active();
+                                        if (ix < 0 ) {
+                                            return '';
+                                        }
+                                        return this.get('model').data[ix].xtype;
+                            },
+                            init : function() {
+                                XObject.prototype.init.call(this);
+                              this.el.add_attribute(this.items[0].el , 'markup', 1 );  
+                            },
+                            items : [
+                                {
+                                    xtype: Gtk.CellRendererText,
+                                    pack : "pack_start"
+                                },
+                                {
+                                    xtype: Gtk.ListStore,
+                                    pack : "set_model",
+                                    init : function() {
+                                        XObject.prototype.init.call(this);
+                                    
+                                                                this.el.set_column_types ( 2, [
+                                                                    GObject.TYPE_STRING,  // real key
+                                                                    GObject.TYPE_STRING // real type
+                                                                    
+                                                                    
+                                                                ] );
+                                                                
+                                                                this.data = [
+                                                                    { xtype: 'Roo', desc : "Roo Project" },
+                                                                    { xtype: 'Gtk', desc : "Gtk Project" },    
+                                                                    //{ xtype: 'JS', desc : "Javascript Class" }
+                                                                ]
+                                                                
+                                                                this.loadData(this.data);
+                                                                    
+                                    },
+                                    loadData : function (data) {
+                                                                                
+                                                var iter = new Gtk.TreeIter();
+                                                var el = this.el;
+                                                data.forEach(function(p) {
+                                                    
+                                                    el.append(iter);
+                                                    
+                                                     
+                                                    el.set_value(iter, 0, p.xtype);
+                                                    el.set_value(iter, 1, p.desc);
+                                                    
+                                                });
+                                                  
+                                                                         
+                                    },
+                                    id : "model"
+                                }
+                            ]
+                        }
+                    ]
+                },
+                {
+                    xtype: Gtk.FileChooserWidget,
+                    pack : "pack_end,true,true,5",
+                    action : Gtk.FileChooserAction.SELECT_FOLDER,
+                    id : "dir",
+                    select_multiple : false
+                }
+            ]
+        },
+        {
+            xtype: Gtk.Button,
+            pack : "add_action_widget,1",
+            label : "OK"
+        },
+        {
+            xtype: Gtk.Button,
+            pack : "add_action_widget,0",
+            label : "Cancel"
+        }
+    ]
+});
+EditProject.init();
+XObject.cache['/EditProject'] = EditProject;

diff --git a/Builder/Provider/File/Base.js b/Builder/Provider/File/Base.js
new file mode 100644 (file)
index 0000000..c37d992
--- /dev/null
+++ b/Builder/Provider/File/Base.js
@@ -0,0 +1,381 @@
+//<Script type="text/javascript">
+
+console = imports.console;
+XObject = imports.XObject.XObject;
+
+Lang = imports.Builder.Provider.File.Lang.Lang;
+
+File = imports.File.File;
+// File Provider..
+
+Base = XObject.define(
+    
+    function(cfg) {
+        
+        XObject.extend(this, cfg);
+        
+    },
+    Object,
+    {
+        /**
+         * @cfg {Array} doubleStringProps list of properties that can be double quoted.
+         */
+        doubleStringProps : false,
+        
+        id : false,
+        name : false,   // is the JS name of the file.
+        path : '',      // is the full path to the file.
+        parent : false, // JS parent.
+        
+        title : false,  // a title.. ?? nickname.. ??? - 
+        project: false, // name...
+        //Project : false, // link to container project!
+        
+        items : false, // the tree of nodes.
+        
+        cn : false, // array used by project tree.
+        
+        
+        save : function()
+        {
+            var write = { }; 
+            var _this = this;
+            var write = this.toJsonArray()
+            print("WRITE: " + this.path);// + "\n" + JSON.stringify(write));
+            File.write(this.path, JSON.stringify(write, null, 4));
+        },
+        
+        /**
+         * accepts:
+         * { success : , failure : , scope : }
+         * 
+         * 
+         * 
+         */
+         
+        getTree : function( o ) {
+            console.log("File.getTree tree called on base object?!?!");
+        },
+        toJsonArray : function()
+        {
+            var ret = { }; 
+            var _this = this;
+            ['id', 'name', 'parent', 'title', 'path', 'items' , 'permname', 'modOrder' ].forEach( function(k) {
+                ret[k] = typeof(_this[k]) == 'undefined' ? '' : _this[k];
+            });
+            return ret;
+        },
+        getTitle : function()
+        {
+            if (this.title) {
+                return this.title;
+            }
+            return this.path.split('/').pop();
+            
+        },
+        getTitleTip: function()
+        {
+            if (this.title) {
+                return '<b>' + this.title + '</b> ' + this.path;
+            }
+            return this.path;
+        },
+        sortCn: function()
+        {
+            this.cn.sort(function(a,b) {
+                return a.path > b.path;// ? 1 : -1;
+            });
+        },
+        // should be in palete provider really..
+        
+        guessName : function(ar) // turns the object into full name.
+        {
+             // eg. xns: Roo, xtype: XXX -> Roo.xxx
+            if (typeof( ar['|xns'] ) == 'undefined' || typeof( ar['xtype'] ) == 'undefined') {
+                return '';
+               }
+             
+            return ar['|xns'] +'.' + ar['xtype'];
+                            
+                                 
+        },
+        
+        /*
+        Roo specific?
+        toSourceStdClass: function()
+        {
+            var cfg = this.items[0]
+            var fcfg = XObject.extend({ },  this.items[0]);
+            delete fcfg['*class'];
+            delete fcfg['*extends'];
+            delete fcfg['*static'];
+            delete fcfg['|constructor'];
+            
+            var hasExtends = (typeof(cfg['*extends']) != 'undefined') && cfg['*extends'].length;
+            var hasConstructor = (typeof(cfg['|constructor']) != 'undefined');
+            var isStatic = (typeof(cfg['*static']) == '*static');
+            
+            var newline = '';
+            var endline = '';
+            if (hasExtends) {
+                newline =  hasConstructor ? 
+                
+                 
+                    cfg['//constructor'] + "\n" + 
+                    cfg['*class'] + " = " + cfg['|constructor'] + "\n\n"+ 
+                    "Roo.extend(" + cfg['*class'] + ":, " + cfg['*extends'] + ", " :
+                    
+                    cfg['//*class'] + "\n" + 
+                    cfg['*class'] + " = new " + cfg['*extends'] + "(" ;
+                
+                endline = ');';
+            } else {
+                
+                
+                
+                newline  = hasConstructor ? 
+                
+                    cfg['//constructor'] + "\n" + 
+                    cfg['*class'] + " = " + cfg['|constructor'] + "\n\n"+ 
+                    'Roo.apply( ' +  cfg['*class'] + ".prototype , " :
+                    
+                    cfg['//*class'] + "\n" + 
+                    cfg['*class'] + " = ";
+                
+                    
+                endline = hasConstructor ? ');' : ';';
+            }
+                  
+            return this.outputHeader() + 
+                    newline + 
+                    this.objectToJsString(fcfg,1) +
+                    endline;
+            
+            
+            
+         
+        },
+        */
+        
+        copyTo: function(path, cb)
+        {
+            var _this = this;
+            this.loadItems(function() {
+                
+                _this.path = path;
+                cb();
+            });
+            
+        },
+        
+        /**
+         * 
+         * munge JSON tree into Javascript code.
+         * 
+         * FIXME: + or / prefixes to properties hide it from renderer.
+         * FIXME: '*props' - not supported by this.. ?? - upto rendering code..
+         * FIXME: needs to understand what properties might be translatable (eg. double quotes)
+         * 
+         * @arg {object} obj the object or array to munge..
+         * @arg {boolean} isListener - is the array being sent a listener..
+         * @arg {string} pad - the padding to indent with. 
+         */
+        
+        
+        mungeToString:  function(obj, isListener, pad)
+        {
+            pad = pad || '    ';
+            var keys = [];
+            var isArray = false;
+            isListener = isListener || false;
+             
+            // am I munging a object or array...
+            if (obj.constructor.toString() === Array.toString()) {
+                for (var i= 0; i < obj.length; i++) {
+                    keys.push(i);
+                }
+                isArray = true;
+            } else {
+                for (var i in obj) {
+                    keys.push(i);
+                }
+            }
+            
+            
+            var els = []; 
+            var skip = [];
+            if (!isArray && 
+                    typeof(obj['|xns']) != 'undefined' &&
+                    typeof(obj['xtype']) != 'undefined'
+                ) {
+                    this.mungeXtype(obj['|xns'] + '.' + obj['xtype'], els);
+                    //els.push('xtype: '+ obj['|xns'] + '.' + obj['xtype']);
+                    skip.push('|xns','xtype');
+                }
+            
+            
+            if (!isArray && obj.items && obj.items.length) {
+                // look for props..
+                var newitems = [];
+                obj.items.forEach(function(pl) {
+                    if (typeof(pl['*prop']) == 'undefined') {
+                        newitems.push(pl);
+                        return;
+                    }
+                    // we have a prop...
+                    var prop = pl['*prop'] + '';
+                    delete pl['*prop'];
+                    if (!prop.match(/\[\]$/)) {
+                        // it's a standard prop..
+                        obj[prop] = pl;
+                        keys.push(prop);
+                        return;
+                    }
+                    prop  = prop.substring(0, prop.length -2); //strip []
+                    // it's an array type..
+                    obj[prop] = obj[prop]  || [];
+                    obj[prop].push(pl);
+                    print("ADDNG PROP:" + prop + ' ' + keys.indexOf(prop) );
+                    if (keys.indexOf(prop) < 0) {
+                        keys.push(prop);
+                    }
+                    
+                    
+                    
+                });
+                obj.items = newitems;
+                if (!obj.items.length) {
+                    delete obj.items;
+                }
+                
+            }
+            
+            
+            
+            
+            
+            var _this = this;
+            
+            var left =  '';
+            
+            keys.forEach(function(i) {
+              
+                if (typeof(obj[i]) == 'undefined') { // empty or removed.
+                    return;
+                }
+                var el = obj[i];
+                if (!isArray && skip.indexOf(i) > -1) { // things we do not write..
+                    return;
+                }
+                if (!isArray) {
+                    // set the key to be quoted with singel quotes..
+                    var leftv = i[0] == '|' ? i.substring(1) : i;
+                    if (Lang.isKeyword(leftv) || Lang.isBuiltin(leftv)) {
+                        left = "'" + leftv + "'";
+                    } else if (leftv.match(/[^A-Z_]+/i)) { // not plain a-z... - quoted.
+                        var val = JSON.stringify(leftv);
+                        left = "'" + val.substring(1, val.length-1).replace(/'/g, "\\'") + "'";
+                    } else {
+                        left = '' + leftv;
+                    }
+                    left += ' : ';
+                    
+                }
+                if (isListener) {
+                    // change the lines...
+                    var str= ('' + obj[i]).replace(/^\s+|\s+$/g,"");
+                    var lines = str.split("\n");
+                    if (lines.length > 1) {
+                        str = lines.join("\n" + pad);
+                    }
+                    els.push(left  + str);
+                    return;
+                }
+                 
+                
+                
+                //var left = isArray ? '' : (JSON.stringify(i) + " : " )
+                
+                if (i[0] == '|') {
+                    // does not hapepnd with arrays..
+                    if (typeof(el) == 'string' && !obj[i].length) { //skip empty.
+                        return;
+                    }
+                    // this needs to go...
+                    //if (typeof(el) == 'string'  && obj[i].match(new RegExp("Gtk.main" + "_quit"))) { // we can not handle this very well..
+                    //    return;
+                    //}
+                    
+                    var str= ('' + obj[i]).replace(/^\s+|\s+$/g,"");;
+                    var lines = str.split("\n");
+                    if (lines.length > 1) {
+                        str = lines.join("\n" + pad);
+                    }
+                    
+                    els.push(left + str);
+                    return;
+                }
+                
+                
+                
+                
+                if (typeof(el) == 'object') {
+                    
+                    // we can skip empty items lists and empty listeners..
+                    //if (!isArray && i == 'items' && !el.length) {
+                    //    return; 
+                    //}
+                   // 
+                    var right = _this.mungeToString(el, i == 'listeners', pad + '    ');
+                    if (typeof(right) != 'undefined') {
+                        els.push(left + right);
+                    }
+                
+                    return;
+                }
+                // standard. .
+                if (typeof(obj[i]) != 'string') {
+                    els.push(left + JSON.stringify(obj[i]));
+                    return;
+                }
+                // strings..
+                if (!_this.doubleStringProps) {
+                    els.push(left + JSON.stringify(obj[i]));
+                    return;
+                }
+                if (_this.doubleStringProps.indexOf(i) > -1) {
+                    els.push(left + JSON.stringify(obj[i]));
+                    return;
+                }
+                // single quote..
+                els.push(left + "'" + obj[i].replace(/'/g, "\\'") + "'");
+                
+
+            });
+            
+            if (!isArray && !els.length) {
+                return;
+            }
+            //output the thing.
+            var spad = pad.substring(0, pad.length-4);
+            return (isArray ? '[' : '{') + "\n" +
+                pad  + els.join(",\n" + pad ) + 
+                "\n" + spad + (isArray ? ']' : '}');
+               
+            
+            
+        } 
+        
+         
+        
+    }
+    
+     
+    
+);
+
+
+
+
+
+

diff --git a/Builder/Provider/File/Roo.js b/Builder/Provider/File/Roo.js
new file mode 100644 (file)
index 0000000..3c84d6e
--- /dev/null
+++ b/Builder/Provider/File/Roo.js
@@ -0,0 +1,462 @@
+//<Script type="text/javascript">
+
+ 
+Gio = imports.gi.Gio;
+console = imports.console;
+XObject = imports.XObject.XObject;
+
+  
+//----------------------- our roo verison
+Base = imports.Builder.Provider.File.Base.Base;
+Gio = imports.gi.Gio;
+File = imports.File.File;
+
+//JSDOC =  imports['JSDOC.js'];
+//----------------------- our roo verison
+
+var rid = 0;
+
+Roo = XObject.define(
+    function(cfg) {
+        
+        // id ,
+        //"name":"Edit Module Details",
+        // items : 
+        //"btype":"FORM", // was to be components...
+        //"app":"Builder",
+        //"module":"Pman.Tab.BuilderTop2"
+        //console.dump(cfg);
+        
+        if (!cfg.name || !cfg.fullname ) {
+            cfg.name = cfg.path.split('/').pop().replace(/\.bjs$/, '');
+            //cfg.fullname = (cfg.parent && cfg.parent.length ? (cfg.parent + '.') : '' ) + cfg.name;
+            cfg.fullname = cfg.name;
+        }
+        
+        
+        this.items = false;
+        if (cfg.json) {
+            var jstr =  JSON.parse(cfg.json);
+            this.items = [ jstr ];
+            //console.log(cfg.items.length);
+            delete cfg.json; // not needed!
+        }
+        this.cn = [];
+         /*
+        var p = cfg.items && cfg.items.length && cfg.items[0].parent ? cfg.items[0].parent : false;
+        
+        // ensure real data is set...
+        Roo.apply(this, {
+            name : cfg.module,
+            parent : p,
+            title : cfg.name,
+            project : cfg.app
+            
+        });
+        
+        this.cn = [];
+        */
+        Roo.superclass.constructor.call(this, cfg);
+
+        
+        // super?!?!
+        this.id = 'roo-file-' + (rid++);
+        // various loader methods..
+    },
+    Base,
+    {
+        doubleStringProps : [ 
+            'title',
+            'legend',
+            'loadingText',
+            'emptyText',
+            'qtip',
+            'value',
+            'text'
+        ],
+        modOrder : '001', /// sequence id that this uses.
+        region : 'center',
+        parent : '',
+        title : '', // the title on displayed when loading.
+        disable : '', // use a function to that returns false to disable this..
+        permname: '', /// permission name
+        
+        setNSID : function(id)
+        {
+            
+            this.items[0]['|module'] = id;
+       
+            
+        },
+        
+        
+        getType: function() {
+            return 'Roo';
+        },
+        
+      
+        loadItems : function(cb)
+        {
+            console.log("load Items!");
+            if (this.items !== false) {
+                return false;
+            }
+            var file = Gio.file_new_for_path(this.path);
+            
+            var _this = this;                        
+            file.read_async(0, null, function(source,result) {
+                var stream = source.read_finish(result)
+                var dstream = new Gio.DataInputStream.c_new(stream);
+                
+                var src = dstream.read_until("")
+                
+                var cfg = JSON.parse(src);
+                print("loaded data");
+                console.dump(cfg);
+                _this.modOrder = cfg.modOrder || '001';
+                _this.name = cfg.name.replace(/\.bjs/, ''); // BC!
+                _this.parent =  cfg.parent;
+                _this.permname =  cfg.permname || '';
+                _this.title =  cfg.title;
+                _this.items = cfg.items || []; 
+                
+                _this.fixItems(_this, false);
+                
+                
+                
+                cb();
+                /*
+                var tstream =  new JSDOC.TextStream(src);
+                var tr = new  JSDOC.TokenReader( {
+                    keepWhite : true,
+                    keepComments : true
+                });
+                var toks = tr.tokenize(tstream);
+                var ts = new JSDOC.Collapse(toks);
+                //console.dump(ts.tokens);
+                var rd = new JSDOC.RooFile(ts.tokens);
+                try {
+                    rd.parse();
+                } catch (e) {
+                    console.log(e);
+                    _this.items = [ src ];
+                    cb();
+                    return;
+                }
+                 
+                console.dump(rd.cfg);
+                //!!??? have we got engouth!
+                // try parsing self..
+                _this.items = [ rd.cfg ];
+                cb();
+                */
+                
+            });
+            
+            
+            
+        },
+        /**
+         * old code had broken xtypes and used arrays differently,
+         * this code should try and clean it up..
+         * 
+         * 
+         */
+        fixItems : function(node, fixthis)
+        {
+            if (fixthis) {
+                // fix xtype.
+                var fn = this.guessName(node);
+                //print("guessname got " + fn);
+                if (fn) {
+                    var bits = fn.split('.');
+                    node.xtype = bits.pop();
+                    node['|xns'] = bits.join('.');
+                    
+                }
+                // fix array???
+                 
+                
+            }
+            if (!node.items || !node.items.length) {
+                return;
+            }
+            var _this = this;
+            var aitems = [];
+            var nitems = [];
+            node.items.forEach(function(i) {
+                
+                
+                
+                _this.fixItems(i, true);
+                if (i.xtype == 'Array') {
+                    aitems.push(i);
+                    return;
+                }    
+                nitems.push(i);
+            });
+            node.items = nitems; 
+            
+            if (!aitems.length) {
+                return;
+            }
+            
+            aitems.forEach(function(i) {
+                
+                if (!i.items || !i.items.length) {
+                    return;
+                }
+                var prop = i['*prop'] + '[]';
+                // colModel to cm?
+                i.items.forEach(function(c) {
+                    c['*prop']  = prop;
+                    node.items.push(c);
+                    
+                });
+                
+                
+            });
+            
+            
+            // array handling.. 
+            
+            
+            
+            
+            
+        },
+        
+        save : function()
+        {
+            Base.prototype.save.call(this);
+            // now write the js file..
+            var js = this.path.replace(/\.bjs$/, '.js');
+            var d = new Date();
+            var js_src = this.toSource();
+            print("TO SOURCE in " + ((new Date()) - d) + "ms");
+            File.write(js, js_src);
+            
+            
+            
+        },
+         /**
+         * convert xtype for munged output..
+         * 
+         */
+        mungeXtype : function(xtype, els)
+        {
+            var bits = xtype.split('.');
+            // assume it has lenght!
+            
+            els.push("xtype: '"+ bits.pop()+"'");
+            els.push('xns: '+ bits.join('.'));
+        },
+        
+        /**
+         * This needs to use some options on the project
+         * to determine how the file is output..
+         * 
+         * At present we are hard coding it..
+         * 
+         * 
+         */
+        toSource: function()
+        {
+            // dump the file tree back out to a string.
+            
+            // we have 2 types = dialogs and components
+            // 
+            var top = this.guessName(this.items[0]);
+            if (!top) {
+                return false;
+            }
+            if (top.match(/Dialog/)) {
+                return this.toSourceDialog();
+            }
+            return this.toSourceLayout();
+            
+            /*
+            eventually support 'classes??'
+             return this.toSourceStdClass();
+            */
+              
+        },
+       
+        outputHeader : function()
+        {
+            return [
+                "//<script type=\"text/javascript\">",
+                "",
+                "// Auto generated file - created by app.Builder.js- do not edit directly (at present!)",
+                ""
+            ].join("\n");
+            
+       
+        },
+        // a standard dialog module.
+        // fixme - this could be alot neater..
+        toSourceDialog : function() 
+        {
+            var items = JSON.parse(JSON.stringify(this.items[0]));
+            var o = this.mungeToString(items, false, '            ');   
+            return [
+                this.outputHeader(),
+                this.name + " = {",
+                "",
+                "    dialog : false,",
+                "    callback:  false,",
+                "",   
+                "    show : function(data, cb)",
+                "    {",
+                "        if (!this.dialog) {",
+                "            this.create();",
+                "        }",
+                "",
+                "        this.callback = cb;",
+                "        this.data = data;",
+                "        this.dialog.show(this.data._el);",
+                "        if (this.form) {",
+                "           this.form.reset();",
+                "           this.form.setValues(data);",
+                "           this.form.fireEvent('actioncomplete', this.form,  { type: 'setdata', data: data });",
+                "        }",
+                "",   
+                "    },",
+                "",
+                "    create : function()",
+                "    {",
+                "        var _this = this;",
+                "        this.dialog = Roo.factory(" + o +  ");",
+                "    }",
+                "};",
+                ""
+                
+             ].join("\n");
+             
+             
+             
+        },
+        // a layout compoent 
+        toSourceLayout : function() 
+        {
+            var items = JSON.parse(JSON.stringify(this.items[0]));
+            var o = this.mungeToString(items, false, '            ');   
+             
+            var modkey = this.modOrder + '-' + this.name.replace('/[^A-Z]+/ig', '-');
+            
+            
+            if (this.name.match(/^Pman/)) {
+                    
+                
+                // old BC way we did things..
+                return [
+                    this.outputHeader(),
+                    "",
+                    "",
+                    "// register the module first",
+                    "Pman.on('beforeload', function()",
+                    "{",
+                    "    Pman.register({",
+                    "        modKey : '" +modkey+"',",
+                    "        module : " + this.name + ",",
+                    "        region : '" + this.region   +"',",
+                    "        parent : " + (this.parent ||  'false') + ",",
+                    "        name : " + JSON.stringify(this.title  || "unnamed module") + ",",
+                    "        disabled : " + (this.disabled || 'false') +", ",
+                    "        permname: '" + (this.permname|| '') +"' ",
+                    "    });",
+                    "});",
+                    "",
+                    
+                    this.name  +  " = new Roo.util.Observable({",
+                    "",
+                    "    panel : false,",
+                    "    disabled : false,",
+                    "    parentLayout:  false,",
+                    "",
+                    "    add : function(parentLayout, region)",
+                    "    {",
+                    "",
+                    "        var _this = this;", // standard avaialbe..
+                    "        this.parentLayout = parentLayout;",
+                    "",
+                    "        this.panel = parentLayout.addxtype(" + o +  ");",
+                    "        this.layout = this.panel.layout;",
+                    "",
+                    "    }",
+                    "});",
+                    ""
+                     
+                    
+                 ].join("\n");
+            }
+            
+        
+            return [
+                this.outputHeader(),
+                
+                this.name  +  " = new Roo.XComponent({",
+                "    order    : '" +modkey+"',",
+                "    region   : '" + this.region   +"',",
+                "    parent   : "+ (this.parent ?  "'" + this.parent + "'" :  'false') + ",",
+                "    name     : " + JSON.stringify(this.title  || "unnamed module") + ",",
+                "    disabled : " + (this.disabled || 'false') +", ",
+                "    tree : function()",
+                "    {",
+                "        var _this = this;", // bc
+                "        var MODULE = this;", /// this looks like a better name.
+                "        return " + o + ';',
+                "    }",
+                "});",
+                ""
+                 
+             ].join("\n");
+            
+        },
+            
+        guessName : function(ar) // turns the object into full name.
+        {
+             // eg. xns: Roo, xtype: XXX -> Roo.xxx
+            if (!ar) {
+                return false;
+            }
+            var ret = [];
+            ret.push(typeof( ar['|xns'] ) == 'undefined' ? 'Roo' : ar['|xns'] );
+            
+            
+            
+            if (typeof( ar['xtype'] ) == 'undefined' || !ar['xtype'].length) {
+                return false;
+            }
+            var xtype = ar['xtype'] + '';
+            if (xtype[0] == '*') { // prefixes????
+                xtype  = xtype.substring(1);
+            }
+            if (xtype.match(/^Roo/)) {
+                // already starts with roo...
+                ret = [];
+            }
+            ret.push(xtype);
+            var str =  ret.join('.');
+            
+            
+            
+            var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+            return pm.getPalete('Roo').guessName(ret.join('.'));
+            
+                            
+                                 
+        },
+        /*
+        getTree : function( o ) {
+            
+            
+            
+        }
+        */
+         getHelpUrl : function(cls)
+        {
+            return 'http://www.akbkhome.com/roojs1/docs/symbols/' + cls + '.html';
+        }
+        
+});
\ No newline at end of file

diff --git a/Builder/Provider/rooprops.json b/Builder/Provider/rooprops.json
new file mode 100644 (file)
index 0000000..b1777e3
--- /dev/null
+++ b/Builder/Provider/rooprops.json
@@ -0,0 +1,15463 @@
+{
+ "success": true,
+ "data": {
+  "Array": {
+   "props": [],
+   "events": []
+  },
+  "Date": {
+   "props": [],
+   "events": []
+  },
+  "Function": {
+   "props": [],
+   "events": []
+  },
+  "Number": {
+   "props": [],
+   "events": []
+  },
+  "Roo": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Ajax": {
+   "props": [],
+   "events": [
+    {
+     "name": "beforerequest",
+     "sig": "function (conn, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a network request is made to retrieve a data object."
+    },
+    {
+     "name": "requestcomplete",
+     "sig": "function (conn, response, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if the request was successfully completed."
+    },
+    {
+     "name": "requestexception",
+     "sig": "function (conn, response, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an error HTTP status was returned from the server.\nSee {@link http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html} for details of HTTP status codes."
+    }
+   ]
+  },
+  "Roo.BasicDialog": {
+   "props": [
+    {
+     "name": "autoCreate",
+     "type": "Boolean/DomHelper",
+     "desc": "True to auto create from scratch, or using a DomHelper Object (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "Default text to display in the title bar (defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "Width of the dialog in pixels (can also be set via CSS).  Determined by browser if unspecified.",
+     "memberOf": ""
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "Height of the dialog in pixels (can also be set via CSS).  Determined by browser if unspecified.",
+     "memberOf": ""
+    },
+    {
+     "name": "x",
+     "type": "Number",
+     "desc": "The default left page coordinate of the dialog (defaults to center screen)",
+     "memberOf": ""
+    },
+    {
+     "name": "y",
+     "type": "Number",
+     "desc": "The default top page coordinate of the dialog (defaults to center screen)",
+     "memberOf": ""
+    },
+    {
+     "name": "animateTarget",
+     "type": "String/Element",
+     "desc": "Id or element from which the dialog should animate while opening\n(defaults to null with no animation)",
+     "memberOf": ""
+    },
+    {
+     "name": "resizable",
+     "type": "Boolean",
+     "desc": "False to disable manual dialog resizing (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "resizeHandles",
+     "type": "String",
+     "desc": "Which resize handles to display - see the {@link Roo.Resizable} handles config\nproperty for valid values (defaults to 'all')",
+     "memberOf": ""
+    },
+    {
+     "name": "minHeight",
+     "type": "Number",
+     "desc": "The minimum allowable height for a resizable dialog (defaults to 80)",
+     "memberOf": ""
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum allowable width for a resizable dialog (defaults to 200)",
+     "memberOf": ""
+    },
+    {
+     "name": "modal",
+     "type": "Boolean",
+     "desc": "True to show the dialog modally, preventing user interaction with the rest of the page (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to allow the dialog body contents to overflow and display scrollbars (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "False to remove the built-in top-right corner close button (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "collapsible",
+     "type": "Boolean",
+     "desc": "False to remove the built-in top-right corner collapse button (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "constraintoviewport",
+     "type": "Boolean",
+     "desc": "True to keep the dialog constrained within the visible viewport boundaries (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "syncHeightBeforeShow",
+     "type": "Boolean",
+     "desc": "True to cause the dimensions to be recalculated before the dialog is shown (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "draggable",
+     "type": "Boolean",
+     "desc": "False to disable dragging of the dialog within the viewport (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoTabs",
+     "type": "Boolean",
+     "desc": "If true, all elements with class 'x-dlg-tab' will get automatically converted to tabs (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "tabTag",
+     "type": "String",
+     "desc": "The tag name of tab elements, used when autoTabs = true (defaults to 'div')",
+     "memberOf": ""
+    },
+    {
+     "name": "proxyDrag",
+     "type": "Boolean",
+     "desc": "True to drag a lightweight proxy element rather than the dialog itself, used when\ndraggable = true (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "fixedcenter",
+     "type": "Boolean",
+     "desc": "True to ensure that anytime the dialog is shown or resized it gets centered (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\" for bottom-right\nshadow (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "shadowOffset",
+     "type": "Number",
+     "desc": "The number of pixels to offset the shadow if displayed (defaults to 5)",
+     "memberOf": ""
+    },
+    {
+     "name": "buttonAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"center\" and \"right\" (defaults to \"right\")",
+     "memberOf": ""
+    },
+    {
+     "name": "minButtonWidth",
+     "type": "Number",
+     "desc": "Minimum width of all dialog buttons (defaults to 75)",
+     "memberOf": ""
+    },
+    {
+     "name": "buttons",
+     "type": "Array",
+     "desc": "Array of buttons",
+     "memberOf": ""
+    },
+    {
+     "name": "shim",
+     "type": "Boolean",
+     "desc": "True to create an iframe shim that prevents selects from showing through (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this dialog is hidden."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this dialog is shown."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is hidden."
+    },
+    {
+     "name": "keydown",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a key is pressed"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is moved by the user."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is resized by the user."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is shown."
+    }
+   ]
+  },
+  "Roo.BasicLayoutRegion": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeremove",
+     "sig": "function (_self, panel, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a panel is removed (or closed). To cancel the removal set \"e.cancel = true\" on the event argument."
+    },
+    {
+     "name": "collapsed",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is collapsed."
+    },
+    {
+     "name": "expanded",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is expanded."
+    },
+    {
+     "name": "invalidated",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the layout for this region is changed."
+    },
+    {
+     "name": "panelactivated",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is activated."
+    },
+    {
+     "name": "paneladded",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is added."
+    },
+    {
+     "name": "panelremoved",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is removed."
+    },
+    {
+     "name": "resized",
+     "sig": "function (_self, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes this region."
+    },
+    {
+     "name": "slidehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region slides out of view."
+    },
+    {
+     "name": "slideshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is slid into view."
+    },
+    {
+     "name": "visibilitychange",
+     "sig": "function (_self, visibility)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is shown or hidden"
+    }
+   ]
+  },
+  "Roo.BorderLayout": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "layout",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a layout is performed."
+    },
+    {
+     "name": "regioncollapsed",
+     "sig": "function (region)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a region is collapsed."
+    },
+    {
+     "name": "regionexpanded",
+     "sig": "function (region)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a region is expanded."
+    },
+    {
+     "name": "regionresized",
+     "sig": "function (region, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes a region."
+    }
+   ]
+  },
+  "Roo.BoxComponent": {
+   "props": [
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": ""
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.Button": {
+   "props": [
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The button text",
+     "memberOf": ""
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an image to display in the button (the image will be set as the background-image\nCSS property of the button by default, so if you want a mixed icon/text button, set cls:\"x-btn-text-icon\")",
+     "memberOf": ""
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function called when the button is clicked (can be used instead of click event)",
+     "memberOf": ""
+    },
+    {
+     "name": "scope",
+     "type": "Object",
+     "desc": "The scope of the handler",
+     "memberOf": ""
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width for this button (used to give a set of buttons a common width)",
+     "memberOf": ""
+    },
+    {
+     "name": "tooltip",
+     "type": "String/Object",
+     "desc": "The tooltip for the button - can be a string or QuickTips config object",
+     "memberOf": ""
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "True to start hidden (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to start disabled (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "pressed",
+     "type": "Boolean",
+     "desc": "True to start pressed (only if enableToggle = true)",
+     "memberOf": ""
+    },
+    {
+     "name": "toggleGroup",
+     "type": "String",
+     "desc": "The group this toggle button is a member of (only 1 per group can be pressed, only\n   applies if enableToggle = true)",
+     "memberOf": ""
+    },
+    {
+     "name": "renderTo",
+     "type": "String/HTMLElement/Element",
+     "desc": "The element to append the button to",
+     "memberOf": ""
+    },
+    {
+     "name": "repeat",
+     "type": "Boolean/Object",
+     "desc": "True to repeat fire the click event while the mouse is down. This can also be\n  an {@link Roo.util.ClickRepeater} config object (defaults to false).",
+     "memberOf": ""
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the button's main element.",
+     "memberOf": ""
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The DOM tabIndex for this button (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "enableToggle",
+     "type": "Boolean",
+     "desc": "True to enable pressed/not pressed toggling (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "menu",
+     "type": "Mixed",
+     "desc": "Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).",
+     "memberOf": ""
+    },
+    {
+     "name": "menuAlign",
+     "type": "String",
+     "desc": "The position to align the menu to (see {@link Roo.Element#alignTo} for more details, defaults to 'tl-bl?').",
+     "memberOf": ""
+    },
+    {
+     "name": "iconCls",
+     "type": "String",
+     "desc": "A css class which sets a background image to be used as the icon for this button (defaults to undefined).",
+     "memberOf": ""
+    },
+    {
+     "name": "type",
+     "type": "String",
+     "desc": "The button's type, corresponding to the DOM input element type attribute.  Either \"submit,\" \"reset\" or \"button\" (default).",
+     "memberOf": ""
+    },
+    {
+     "name": "clickEvent",
+     "type": "String",
+     "desc": "The type of event to map to the button's event handler (defaults to 'click')",
+     "memberOf": ""
+    },
+    {
+     "name": "handleMouseEvents",
+     "type": "Boolean",
+     "desc": "False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "tooltipType",
+     "type": "String",
+     "desc": "The type of tooltip to use. Either \"qtip\" (default) for QuickTips or \"title\" for title attribute.",
+     "memberOf": ""
+    },
+    {
+     "name": "template",
+     "type": "Roo.Template",
+     "desc": "(Optional)\nAn {@link Roo.Template} with which to create the Button's main element. This Template must\ncontain numeric substitution parameter 0 if it is to display the tRoo property. Changing the template could\nrequire code modifications if required elements (e.g. a button) aren't present.",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this button is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits the button"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse hovers over the button"
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the button is rendered"
+    },
+    {
+     "name": "toggle",
+     "sig": "function (_self, pressed)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the \"pressed\" state of this button changes (only if enableToggle = true)"
+    }
+   ]
+  },
+  "Roo.ColorPalette": {
+   "props": [
+    {
+     "name": "itemCls",
+     "type": "String",
+     "desc": "The CSS class to apply to the containing element (defaults to \"x-color-palette\")",
+     "memberOf": ""
+    },
+    {
+     "name": "value",
+     "type": "String",
+     "desc": "The initial color to highlight (should be a valid 6-digit color hex code without the # symbol).  Note that\nthe hex codes are case-sensitive.",
+     "memberOf": ""
+    },
+    {
+     "name": "allowReselect",
+     "type": "Boolean",
+     "desc": "If set to true then reselecting a color that is already selected fires the selection event",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "select",
+     "sig": "function (_self, color)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a color is selected"
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.Component": {
+   "props": [
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": ""
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": ""
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": ""
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.ComponentMgr": {
+   "props": [],
+   "events": []
+  },
+  "Roo.CompositeElement": {
+   "props": [],
+   "events": []
+  },
+  "Roo.CompositeElementLite": {
+   "props": [],
+   "events": []
+  },
+  "Roo.ContentPanel": {
+   "props": [
+    {
+     "name": "fitToFrame",
+     "type": "Boolean",
+     "desc": "True for this panel to adjust its size to fit when the region resizes  (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "fitContainer",
+     "type": "Boolean",
+     "desc": "When using {@link #fitToFrame} and {@link #resizeEl}, you can also fit the parent container  (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "Boolean/Object",
+     "desc": "True to auto generate the DOM element for this panel, or a {@link Roo.DomHelper} config of the element to create",
+     "memberOf": ""
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "True if the panel can be closed/removed",
+     "memberOf": ""
+    },
+    {
+     "name": "background",
+     "type": "Boolean",
+     "desc": "True if the panel should not be activated when it is added (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "resizeEl",
+     "type": "String/HTMLElement/Element",
+     "desc": "An element to resize if {@link #fitToFrame} is true (instead of this panel's element)",
+     "memberOf": ""
+    },
+    {
+     "name": "toolbar",
+     "type": "Toolbar",
+     "desc": "A toolbar for this panel",
+     "memberOf": ""
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to scroll overflow in this panel (use with {@link #fitToFrame})",
+     "memberOf": ""
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "The title for this panel",
+     "memberOf": ""
+    },
+    {
+     "name": "adjustments",
+     "type": "Array",
+     "desc": "Values to <b>add</b> to the width/height when doing a {@link #fitToFrame} (default is [0, 0])",
+     "memberOf": ""
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "Calls {@link #setUrl} with this value",
+     "memberOf": ""
+    },
+    {
+     "name": "region",
+     "type": "String",
+     "desc": "(center|north|south|east|west) which region to put this panel on (when used with xtype constructors)",
+     "memberOf": ""
+    },
+    {
+     "name": "params",
+     "type": "String/Object",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": ""
+    },
+    {
+     "name": "loadOnce",
+     "type": "Boolean",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is resized if fitToFrame is true."
+    }
+   ]
+  },
+  "Roo.DDView": {
+   "props": [
+    {
+     "name": "dragGroup",
+     "type": "String/Array",
+     "desc": "The ddgroup name(s) for the View's DragZone.",
+     "memberOf": ""
+    },
+    {
+     "name": "dropGroup",
+     "type": "String/Array",
+     "desc": "The ddgroup name(s) for the View's DropZone.",
+     "memberOf": ""
+    },
+    {
+     "name": "copy",
+     "type": "Boolean",
+     "desc": "Causes drag operations to copy nodes rather than move.",
+     "memberOf": ""
+    },
+    {
+     "name": "allowCopy",
+     "type": "Boolean",
+     "desc": "Causes ctrl/drag operations to copy nodes rather than move.",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.DatePicker": {
+   "props": [
+    {
+     "name": "todayText",
+     "type": "String",
+     "desc": "The text to display on the button that selects the current date (defaults to \"Today\")",
+     "memberOf": ""
+    },
+    {
+     "name": "okText",
+     "type": "String",
+     "desc": "The text to display on the ok button",
+     "memberOf": ""
+    },
+    {
+     "name": "cancelText",
+     "type": "String",
+     "desc": "The text to display on the cancel button",
+     "memberOf": ""
+    },
+    {
+     "name": "todayTip",
+     "type": "String",
+     "desc": "The tooltip to display for the button that selects the current date (defaults to \"{current date} (Spacebar)\")",
+     "memberOf": ""
+    },
+    {
+     "name": "minDate",
+     "type": "Date",
+     "desc": "Minimum allowable date (JavaScript date object, defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "maxDate",
+     "type": "Date",
+     "desc": "Maximum allowable date (JavaScript date object, defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "minText",
+     "type": "String",
+     "desc": "The error text to display if the minDate validation fails (defaults to \"This date is before the minimum date\")",
+     "memberOf": ""
+    },
+    {
+     "name": "maxText",
+     "type": "String",
+     "desc": "The error text to display if the maxDate validation fails (defaults to \"This date is after the maximum date\")",
+     "memberOf": ""
+    },
+    {
+     "name": "format",
+     "type": "String",
+     "desc": "The default date format string which can be overriden for localization support.  The format must be\nvalid according to {@link Date#parseDate} (defaults to 'm/d/y').",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDays",
+     "type": "Array",
+     "desc": "An array of days to disable, 0-based. For example, [0, 6] disables Sunday and Saturday (defaults to null).",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDaysText",
+     "type": "String",
+     "desc": "The tooltip to display when the date falls on a disabled day (defaults to \"\")",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDatesRE",
+     "type": "RegExp",
+     "desc": "JavaScript regular expression used to disable a pattern of dates (defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDatesText",
+     "type": "String",
+     "desc": "The tooltip text to display when the date falls on a disabled date (defaults to \"\")",
+     "memberOf": ""
+    },
+    {
+     "name": "constrainToViewport",
+     "type": "Boolean",
+     "desc": "True to constrain the date picker to the viewport (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "monthNames",
+     "type": "Array",
+     "desc": "An array of textual month names which can be overriden for localization support (defaults to Date.monthNames)",
+     "memberOf": ""
+    },
+    {
+     "name": "dayNames",
+     "type": "Array",
+     "desc": "An array of textual day names which can be overriden for localization support (defaults to Date.dayNames)",
+     "memberOf": ""
+    },
+    {
+     "name": "nextText",
+     "type": "String",
+     "desc": "The next month navigation button tooltip (defaults to 'Next Month (Control+Right)')",
+     "memberOf": ""
+    },
+    {
+     "name": "prevText",
+     "type": "String",
+     "desc": "The previous month navigation button tooltip (defaults to 'Previous Month (Control+Left)')",
+     "memberOf": ""
+    },
+    {
+     "name": "monthYearText",
+     "type": "String",
+     "desc": "The header month selector tooltip (defaults to 'Choose a month (Control+Up/Down to move years)')",
+     "memberOf": ""
+    },
+    {
+     "name": "startDay",
+     "type": "Number",
+     "desc": "Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)",
+     "memberOf": ""
+    },
+    {
+     "name": "showClear",
+     "type": "Bool",
+     "desc": "Show a clear button (usefull for date form elements that can be blank.)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "select",
+     "sig": "function (_self, date)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a date is selected"
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.DialogManager": {
+   "props": [],
+   "events": []
+  },
+  "Roo.DomHelper": {
+   "props": [],
+   "events": []
+  },
+  "Roo.DomQuery": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Editor": {
+   "props": [
+    {
+     "name": "autosize",
+     "type": "Boolean/String",
+     "desc": "True for the editor to automatically adopt the size of the underlying field, \"width\" to adopt the width only,\nor \"height\" to adopt the height only (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "revertInvalid",
+     "type": "Boolean",
+     "desc": "True to automatically revert the field value and cancel the edit when the user completes an edit and the field\nvalidation fails (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "ignoreNoChange",
+     "type": "Boolean",
+     "desc": "True to skip the the edit completion process (no save, no events fired) if the user completes an edit and\nthe value has not changed (defaults to false).  Applies only to string values - edits for other data types\nwill never be ignored.",
+     "memberOf": ""
+    },
+    {
+     "name": "hideEl",
+     "type": "Boolean",
+     "desc": "False to keep the bound element visible while the editor is displayed (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "The data value of the underlying field (defaults to \"\")",
+     "memberOf": ""
+    },
+    {
+     "name": "alignment",
+     "type": "String",
+     "desc": "The position to align to (see {@link Roo.Element#alignTo} for more details, defaults to \"c-c?\").",
+     "memberOf": ""
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "\"sides\" for sides/bottom only, \"frame\" for 4-way shadow, and \"drop\"\nfor bottom-right shadow (defaults to \"frame\")",
+     "memberOf": ""
+    },
+    {
+     "name": "constrain",
+     "type": "Boolean",
+     "desc": "True to constrain the editor to the viewport",
+     "memberOf": ""
+    },
+    {
+     "name": "completeOnEnter",
+     "type": "Boolean",
+     "desc": "True to complete the edit when the enter key is pressed (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "cancelOnEsc",
+     "type": "Boolean",
+     "desc": "True to cancel the edit when the escape key is pressed (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "updateEl",
+     "type": "Boolean",
+     "desc": "True to update the innerHTML of the bound element when the update completes (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforecomplete",
+     "sig": "function (_self, value, startValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a change has been made to the field, but before the change is reflected in the underlying\nfield.  Saving the change to the field can be canceled by returning false from the handler of this event.\nNote that if the value has not changed and ignoreNoChange = true, the editing will still end but this\nevent will not fire since no edit actually occurred."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "beforestartedit",
+     "sig": "function (_self, boundEl, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when editing is initiated, but before the value changes.  Editing can be canceled by returning\nfalse from the handler of this event."
+    },
+    {
+     "name": "complete",
+     "sig": "function (_self, value, startValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after editing is complete and any changed value has been written to the underlying field."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "startedit",
+     "sig": "function (boundEl, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this editor is displayed"
+    }
+   ]
+  },
+  "Roo.Element": {
+   "props": [],
+   "events": []
+  },
+  "Roo.EventManager": {
+   "props": [],
+   "events": []
+  },
+  "Roo.EventObject": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Fx": {
+   "props": [
+    {
+     "name": "callback",
+     "type": "Function",
+     "desc": "A function called when the effect is finished",
+     "memberOf": ""
+    },
+    {
+     "name": "scope",
+     "type": "Object",
+     "desc": "The scope of the effect function",
+     "memberOf": ""
+    },
+    {
+     "name": "easing",
+     "type": "String",
+     "desc": "A valid Easing value for the effect",
+     "memberOf": ""
+    },
+    {
+     "name": "afterCls",
+     "type": "String",
+     "desc": "A css class to apply after the effect",
+     "memberOf": ""
+    },
+    {
+     "name": "duration",
+     "type": "Number",
+     "desc": "The length of time (in seconds) that the effect should last",
+     "memberOf": ""
+    },
+    {
+     "name": "remove",
+     "type": "Boolean",
+     "desc": "Whether the Element should be removed from the DOM and destroyed after the effect finishes",
+     "memberOf": ""
+    },
+    {
+     "name": "useDisplay",
+     "type": "Boolean",
+     "desc": "Whether to use the <i>display</i> CSS property instead of <i>visibility</i> when hiding Elements (only applies to \neffects that end with the element being visually hidden, ignored otherwise)",
+     "memberOf": ""
+    },
+    {
+     "name": "afterStyle",
+     "type": "String/Object/Function",
+     "desc": "A style specification string, e.g. \"width:100px\", or an object in the form {width:\"100px\"}, or\na function which returns such a specification that will be applied to the Element after the effect finishes",
+     "memberOf": ""
+    },
+    {
+     "name": "block",
+     "type": "Boolean",
+     "desc": "Whether the effect should block other effects from queueing while it runs",
+     "memberOf": ""
+    },
+    {
+     "name": "concurrent",
+     "type": "Boolean",
+     "desc": "Whether to allow subsequently-queued effects to run at the same time as the current effect, or to ensure that they run in sequence",
+     "memberOf": ""
+    },
+    {
+     "name": "stopFx",
+     "type": "Boolean",
+     "desc": "Whether subsequent effects should be stopped and removed after the current effect finishes",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.GridPanel": {
+   "props": [
+    {
+     "name": "fitToFrame",
+     "type": "Boolean",
+     "desc": "True for this panel to adjust its size to fit when the region resizes  (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "fitContainer",
+     "type": "Boolean",
+     "desc": "When using {@link #fitToFrame} and {@link #resizeEl}, you can also fit the parent container  (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "autoCreate",
+     "type": "Boolean/Object",
+     "desc": "True to auto generate the DOM element for this panel, or a {@link Roo.DomHelper} config of the element to create",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "True if the panel can be closed/removed",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "background",
+     "type": "Boolean",
+     "desc": "True if the panel should not be activated when it is added (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "resizeEl",
+     "type": "String/HTMLElement/Element",
+     "desc": "An element to resize if {@link #fitToFrame} is true (instead of this panel's element)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "toolbar",
+     "type": "Toolbar",
+     "desc": "A toolbar for this panel",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to scroll overflow in this panel (use with {@link #fitToFrame})",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "The title for this panel",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "adjustments",
+     "type": "Array",
+     "desc": "Values to <b>add</b> to the width/height when doing a {@link #fitToFrame} (default is [0, 0])",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "Calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "region",
+     "type": "String",
+     "desc": "(center|north|south|east|west) which region to put this panel on (when used with xtype constructors)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "params",
+     "type": "String/Object",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "loadOnce",
+     "type": "Boolean",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is resized if fitToFrame is true."
+    }
+   ]
+  },
+  "Roo.JsonView": {
+   "props": [
+    {
+     "name": "store",
+     "type": "Roo.data.Store",
+     "desc": "Data store to load data from.",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "el",
+     "type": "String|Roo.Element",
+     "desc": "The container element.",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "tpl",
+     "type": "String|Roo.Template",
+     "desc": "The template used by this View",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "selectedClass",
+     "type": "String",
+     "desc": "The css class to add to selected nodes",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The empty text to show when nothing is loaded.",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "multiSelect",
+     "type": "Boolean",
+     "desc": "Allow multiple selection",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "singleSelect",
+     "type": "Boolean",
+     "desc": "Allow single selection",
+     "memberOf": "Roo.View"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeclick",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a click is processed. Returns false to cancel the default action."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self, data)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before rendering of the downloaded JSON data."
+    },
+    {
+     "name": "beforeselect",
+     "sig": "function (_self, node, selections)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a selection is made. If any handlers return false, the selection is cancelled."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a template node is clicked."
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a template node is right clicked."
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a template node is double clicked."
+    },
+    {
+     "name": "load",
+     "sig": "function (_self, data, response)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when data is loaded."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (_self, response)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when loading fails."
+    },
+    {
+     "name": "selectionchange",
+     "sig": "function (_self, selections)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the selected nodes change."
+    }
+   ]
+  },
+  "Roo.KeyMap": {
+   "props": [],
+   "events": []
+  },
+  "Roo.KeyNav": {
+   "props": [
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable this KeyNav instance (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "defaultEventAction",
+     "type": "String",
+     "desc": "The method to call on the {@link Roo.EventObject} after this KeyNav intercepts a key.  Valid values are\n{@link Roo.EventObject#stopEvent}, {@link Roo.EventObject#preventDefault} and\n{@link Roo.EventObject#stopPropagation} (defaults to 'stopEvent')",
+     "memberOf": ""
+    },
+    {
+     "name": "forceKeyDown",
+     "type": "Boolean",
+     "desc": "Handle the keydown event instead of keypress (defaults to false).  KeyNav automatically does this for IE since\nIE does not propagate special keys on keypress, but setting this to true will force other browsers to also\nhandle keydown instead of keypress.",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.Layer": {
+   "props": [
+    {
+     "name": "shim",
+     "type": "Boolean",
+     "desc": "False to disable the iframe shim in browsers which need one (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "shadow",
+     "type": "String/Boolean",
+     "desc": "True to create a shadow element with default class \"x-layer-shadow\", or\nyou can pass a string with a CSS class name. False turns off the shadow.",
+     "memberOf": ""
+    },
+    {
+     "name": "dh",
+     "type": "Object",
+     "desc": "DomHelper object config to create element with (defaults to {tag: \"div\", cls: \"x-layer\"}).",
+     "memberOf": ""
+    },
+    {
+     "name": "constrain",
+     "type": "Boolean",
+     "desc": "False to disable constrain to viewport (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "CSS class to add to the element",
+     "memberOf": ""
+    },
+    {
+     "name": "zindex",
+     "type": "Number",
+     "desc": "Starting z-index (defaults to 11000)",
+     "memberOf": ""
+    },
+    {
+     "name": "shadowOffset",
+     "type": "Number",
+     "desc": "Number of pixels to offset the shadow (defaults to 3)",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.LayoutDialog": {
+   "props": [
+    {
+     "name": "autoCreate",
+     "type": "Boolean/DomHelper",
+     "desc": "True to auto create from scratch, or using a DomHelper Object (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "Default text to display in the title bar (defaults to null)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "Width of the dialog in pixels (can also be set via CSS).  Determined by browser if unspecified.",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "Height of the dialog in pixels (can also be set via CSS).  Determined by browser if unspecified.",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "x",
+     "type": "Number",
+     "desc": "The default left page coordinate of the dialog (defaults to center screen)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "y",
+     "type": "Number",
+     "desc": "The default top page coordinate of the dialog (defaults to center screen)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "animateTarget",
+     "type": "String/Element",
+     "desc": "Id or element from which the dialog should animate while opening\n(defaults to null with no animation)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "resizable",
+     "type": "Boolean",
+     "desc": "False to disable manual dialog resizing (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "resizeHandles",
+     "type": "String",
+     "desc": "Which resize handles to display - see the {@link Roo.Resizable} handles config\nproperty for valid values (defaults to 'all')",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "minHeight",
+     "type": "Number",
+     "desc": "The minimum allowable height for a resizable dialog (defaults to 80)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum allowable width for a resizable dialog (defaults to 200)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "modal",
+     "type": "Boolean",
+     "desc": "True to show the dialog modally, preventing user interaction with the rest of the page (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to allow the dialog body contents to overflow and display scrollbars (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "False to remove the built-in top-right corner close button (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "collapsible",
+     "type": "Boolean",
+     "desc": "False to remove the built-in top-right corner collapse button (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "constraintoviewport",
+     "type": "Boolean",
+     "desc": "True to keep the dialog constrained within the visible viewport boundaries (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "syncHeightBeforeShow",
+     "type": "Boolean",
+     "desc": "True to cause the dimensions to be recalculated before the dialog is shown (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "draggable",
+     "type": "Boolean",
+     "desc": "False to disable dragging of the dialog within the viewport (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "autoTabs",
+     "type": "Boolean",
+     "desc": "If true, all elements with class 'x-dlg-tab' will get automatically converted to tabs (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "tabTag",
+     "type": "String",
+     "desc": "The tag name of tab elements, used when autoTabs = true (defaults to 'div')",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "proxyDrag",
+     "type": "Boolean",
+     "desc": "True to drag a lightweight proxy element rather than the dialog itself, used when\ndraggable = true (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "fixedcenter",
+     "type": "Boolean",
+     "desc": "True to ensure that anytime the dialog is shown or resized it gets centered (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\" for bottom-right\nshadow (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "shadowOffset",
+     "type": "Number",
+     "desc": "The number of pixels to offset the shadow if displayed (defaults to 5)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "buttonAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"center\" and \"right\" (defaults to \"right\")",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "minButtonWidth",
+     "type": "Number",
+     "desc": "Minimum width of all dialog buttons (defaults to 75)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "buttons",
+     "type": "Array",
+     "desc": "Array of buttons",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "shim",
+     "type": "Boolean",
+     "desc": "True to create an iframe shim that prevents selects from showing through (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this dialog is hidden."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this dialog is shown."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is hidden."
+    },
+    {
+     "name": "keydown",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a key is pressed"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is moved by the user."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is resized by the user."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is shown."
+    }
+   ]
+  },
+  "Roo.LayoutManager": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "layout",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a layout is performed."
+    },
+    {
+     "name": "regioncollapsed",
+     "sig": "function (region)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a region is collapsed."
+    },
+    {
+     "name": "regionexpanded",
+     "sig": "function (region)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a region is expanded."
+    },
+    {
+     "name": "regionresized",
+     "sig": "function (region, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes a region."
+    }
+   ]
+  },
+  "Roo.LayoutRegion": {
+   "props": [
+    {
+     "name": "collapsible",
+     "type": "Boolean",
+     "desc": "False to disable collapsing (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "collapsed",
+     "type": "Boolean",
+     "desc": "True to set the initial display to collapsed (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "floatable",
+     "type": "Boolean",
+     "desc": "False to disable floating (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "margins",
+     "type": "Object",
+     "desc": "Margins for the element (defaults to {top: 0, left: 0, right:0, bottom: 0})",
+     "memberOf": ""
+    },
+    {
+     "name": "cmargins",
+     "type": "Object",
+     "desc": "Margins for the element when collapsed (defaults to: north/south {top: 2, left: 0, right:0, bottom: 2} or east/west {top: 0, left: 2, right:2, bottom: 0})",
+     "memberOf": ""
+    },
+    {
+     "name": "tabPosition",
+     "type": "String",
+     "desc": "\"top\" or \"bottom\" (defaults to \"bottom\")",
+     "memberOf": ""
+    },
+    {
+     "name": "collapsedTitle",
+     "type": "String",
+     "desc": "Optional string message to display in the collapsed block of a north or south region",
+     "memberOf": ""
+    },
+    {
+     "name": "alwaysShowTabs",
+     "type": "Boolean",
+     "desc": "True to always display tabs even when there is only 1 panel (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to enable overflow scrolling (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "titlebar",
+     "type": "Boolean",
+     "desc": "True to display a title bar (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "The title for the region (overrides panel titles)",
+     "memberOf": ""
+    },
+    {
+     "name": "animate",
+     "type": "Boolean",
+     "desc": "True to animate expand/collapse (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoHide",
+     "type": "Boolean",
+     "desc": "False to disable auto hiding when the mouse leaves the \"floated\" region (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "preservePanels",
+     "type": "Boolean",
+     "desc": "True to preserve removed panels so they can be readded later (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "closeOnTab",
+     "type": "Boolean",
+     "desc": "True to place the close icon on the tabs instead of the region titlebar (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "hideTabs",
+     "type": "Boolean",
+     "desc": "True to hide the tab strip (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "resizeTabs",
+     "type": "Boolean",
+     "desc": "True to enable automatic tab resizing. This will resize the tabs so they are all the same size and fit within\nthe space available, similar to FireFox 1.5 tabs (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "minTabWidth",
+     "type": "Number",
+     "desc": "The minimum tab width (defaults to 40)",
+     "memberOf": ""
+    },
+    {
+     "name": "preferredTabWidth",
+     "type": "Number",
+     "desc": "The preferred tab width (defaults to 150)",
+     "memberOf": ""
+    },
+    {
+     "name": "showPin",
+     "type": "Boolean",
+     "desc": "True to show a pin button",
+     "memberOf": ""
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "True to start the region hidden (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "hideWhenEmpty",
+     "type": "Boolean",
+     "desc": "True to hide the region when it has no panels",
+     "memberOf": ""
+    },
+    {
+     "name": "disableTabTips",
+     "type": "Boolean",
+     "desc": "True to disable tab tooltips",
+     "memberOf": ""
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "For East/West panels",
+     "memberOf": ""
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "For North/South panels",
+     "memberOf": ""
+    },
+    {
+     "name": "split",
+     "type": "Boolean",
+     "desc": "To show the splitter",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeremove",
+     "sig": "function (_self, panel, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a panel is removed (or closed). To cancel the removal set \"e.cancel = true\" on the event argument."
+    },
+    {
+     "name": "collapsed",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is collapsed."
+    },
+    {
+     "name": "expanded",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is expanded."
+    },
+    {
+     "name": "invalidated",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the layout for this region is changed."
+    },
+    {
+     "name": "panelactivated",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is activated."
+    },
+    {
+     "name": "paneladded",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is added."
+    },
+    {
+     "name": "panelremoved",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is removed."
+    },
+    {
+     "name": "resized",
+     "sig": "function (_self, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes this region."
+    },
+    {
+     "name": "slidehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region slides out of view."
+    },
+    {
+     "name": "slideshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is slid into view."
+    },
+    {
+     "name": "visibilitychange",
+     "sig": "function (_self, visibility)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is shown or hidden"
+    }
+   ]
+  },
+  "Roo.LoadMask": {
+   "props": [
+    {
+     "name": "removeMask",
+     "type": "Boolean",
+     "desc": "True to create a single-use mask that is automatically destroyed after loading (useful for page loads),\nFalse to persist the mask element reference for multiple uses (e.g., for paged data widgets).  Defaults to false.",
+     "memberOf": ""
+    },
+    {
+     "name": "msg",
+     "type": "String",
+     "desc": "The text to display in a centered loading message box (defaults to 'Loading...')",
+     "memberOf": ""
+    },
+    {
+     "name": "msgCls",
+     "type": "String",
+     "desc": "The CSS class to apply to the loading message element (defaults to \"x-mask-loading\")",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.Login": {
+   "props": [
+    {
+     "name": "method",
+     "type": "String",
+     "desc": "Method used to query for login details.",
+     "memberOf": ""
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "URL to query login data. - eg. baseURL + '/Login.php'",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "Boolean/DomHelper",
+     "desc": "True to auto create from scratch, or using a DomHelper Object (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "Default text to display in the title bar (defaults to null)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "Width of the dialog in pixels (can also be set via CSS).  Determined by browser if unspecified.",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "Height of the dialog in pixels (can also be set via CSS).  Determined by browser if unspecified.",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "x",
+     "type": "Number",
+     "desc": "The default left page coordinate of the dialog (defaults to center screen)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "y",
+     "type": "Number",
+     "desc": "The default top page coordinate of the dialog (defaults to center screen)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "animateTarget",
+     "type": "String/Element",
+     "desc": "Id or element from which the dialog should animate while opening\n(defaults to null with no animation)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "resizable",
+     "type": "Boolean",
+     "desc": "False to disable manual dialog resizing (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "resizeHandles",
+     "type": "String",
+     "desc": "Which resize handles to display - see the {@link Roo.Resizable} handles config\nproperty for valid values (defaults to 'all')",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "minHeight",
+     "type": "Number",
+     "desc": "The minimum allowable height for a resizable dialog (defaults to 80)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum allowable width for a resizable dialog (defaults to 200)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "modal",
+     "type": "Boolean",
+     "desc": "True to show the dialog modally, preventing user interaction with the rest of the page (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to allow the dialog body contents to overflow and display scrollbars (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "False to remove the built-in top-right corner close button (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "collapsible",
+     "type": "Boolean",
+     "desc": "False to remove the built-in top-right corner collapse button (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "constraintoviewport",
+     "type": "Boolean",
+     "desc": "True to keep the dialog constrained within the visible viewport boundaries (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "syncHeightBeforeShow",
+     "type": "Boolean",
+     "desc": "True to cause the dimensions to be recalculated before the dialog is shown (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "draggable",
+     "type": "Boolean",
+     "desc": "False to disable dragging of the dialog within the viewport (defaults to true)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "autoTabs",
+     "type": "Boolean",
+     "desc": "If true, all elements with class 'x-dlg-tab' will get automatically converted to tabs (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "tabTag",
+     "type": "String",
+     "desc": "The tag name of tab elements, used when autoTabs = true (defaults to 'div')",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "proxyDrag",
+     "type": "Boolean",
+     "desc": "True to drag a lightweight proxy element rather than the dialog itself, used when\ndraggable = true (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "fixedcenter",
+     "type": "Boolean",
+     "desc": "True to ensure that anytime the dialog is shown or resized it gets centered (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\" for bottom-right\nshadow (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "shadowOffset",
+     "type": "Number",
+     "desc": "The number of pixels to offset the shadow if displayed (defaults to 5)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "buttonAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"center\" and \"right\" (defaults to \"right\")",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "minButtonWidth",
+     "type": "Number",
+     "desc": "Minimum width of all dialog buttons (defaults to 75)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "buttons",
+     "type": "Array",
+     "desc": "Array of buttons",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "shim",
+     "type": "Boolean",
+     "desc": "True to create an iframe shim that prevents selects from showing through (defaults to false)",
+     "memberOf": "Roo.BasicDialog"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this dialog is hidden."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this dialog is shown."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is hidden."
+    },
+    {
+     "name": "keydown",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a key is pressed"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is moved by the user."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is resized by the user."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this dialog is shown."
+    }
+   ]
+  },
+  "Roo.MasterTemplate": {
+   "props": [
+    {
+     "name": "html",
+     "type": "String",
+     "desc": "The HTML fragment or an array of fragments to join(\"\") or multiple arguments to join(\"\")",
+     "memberOf": "Roo.Template"
+    }
+   ],
+   "events": []
+  },
+  "Roo.MessageBox": {
+   "props": [],
+   "events": []
+  },
+  "Roo.NestedLayoutPanel": {
+   "props": [
+    {
+     "name": "fitToFrame",
+     "type": "Boolean",
+     "desc": "True for this panel to adjust its size to fit when the region resizes  (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "fitContainer",
+     "type": "Boolean",
+     "desc": "When using {@link #fitToFrame} and {@link #resizeEl}, you can also fit the parent container  (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "autoCreate",
+     "type": "Boolean/Object",
+     "desc": "True to auto generate the DOM element for this panel, or a {@link Roo.DomHelper} config of the element to create",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "True if the panel can be closed/removed",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "background",
+     "type": "Boolean",
+     "desc": "True if the panel should not be activated when it is added (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "resizeEl",
+     "type": "String/HTMLElement/Element",
+     "desc": "An element to resize if {@link #fitToFrame} is true (instead of this panel's element)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "toolbar",
+     "type": "Toolbar",
+     "desc": "A toolbar for this panel",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to scroll overflow in this panel (use with {@link #fitToFrame})",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "The title for this panel",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "adjustments",
+     "type": "Array",
+     "desc": "Values to <b>add</b> to the width/height when doing a {@link #fitToFrame} (default is [0, 0])",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "Calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "region",
+     "type": "String",
+     "desc": "(center|north|south|east|west) which region to put this panel on (when used with xtype constructors)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "params",
+     "type": "String/Object",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "loadOnce",
+     "type": "Boolean",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is resized if fitToFrame is true."
+    }
+   ]
+  },
+  "Roo.PagingToolbar": {
+   "props": [
+    {
+     "name": "dataSource",
+     "type": "Roo.data.Store",
+     "desc": "The underlying data store providing the paged data",
+     "memberOf": ""
+    },
+    {
+     "name": "container",
+     "type": "String/HTMLElement/Element",
+     "desc": "container The id or element that will contain the toolbar",
+     "memberOf": ""
+    },
+    {
+     "name": "displayInfo",
+     "type": "Boolean",
+     "desc": "True to display the displayMsg (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "pageSize",
+     "type": "Number",
+     "desc": "The number of records to display per page (defaults to 20)",
+     "memberOf": ""
+    },
+    {
+     "name": "displayMsg",
+     "type": "String",
+     "desc": "The paging status message to display (defaults to \"Displaying {start} - {end} of {total}\")",
+     "memberOf": ""
+    },
+    {
+     "name": "emptyMsg",
+     "type": "String",
+     "desc": "The message to display when no records are found (defaults to \"No data to display\")",
+     "memberOf": ""
+    },
+    {
+     "name": "items",
+     "type": "Roo.data.Store",
+     "desc": "array of button configs or elements to add",
+     "memberOf": "Roo.Toolbar"
+    }
+   ],
+   "events": []
+  },
+  "Roo.QuickTips": {
+   "props": [],
+   "events": []
+  },
+  "Roo.ReaderLayout": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "layout",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a layout is performed."
+    },
+    {
+     "name": "regioncollapsed",
+     "sig": "function (region)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a region is collapsed."
+    },
+    {
+     "name": "regionexpanded",
+     "sig": "function (region)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a region is expanded."
+    },
+    {
+     "name": "regionresized",
+     "sig": "function (region, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes a region."
+    }
+   ]
+  },
+  "Roo.Resizable": {
+   "props": [
+    {
+     "name": "resizeChild",
+     "type": "Boolean/String/Element",
+     "desc": "True to resize the first child, or id/element to resize (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "adjustments",
+     "type": "Array/String",
+     "desc": "String \"auto\" or an array [width, height] with values to be <b>added</b> to the\nresize operation's new size (defaults to [0, 0])",
+     "memberOf": ""
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width for the element (defaults to 5)",
+     "memberOf": ""
+    },
+    {
+     "name": "minHeight",
+     "type": "Number",
+     "desc": "The minimum height for the element (defaults to 5)",
+     "memberOf": ""
+    },
+    {
+     "name": "maxWidth",
+     "type": "Number",
+     "desc": "The maximum width for the element (defaults to 10000)",
+     "memberOf": ""
+    },
+    {
+     "name": "maxHeight",
+     "type": "Number",
+     "desc": "The maximum height for the element (defaults to 10000)",
+     "memberOf": ""
+    },
+    {
+     "name": "enabled",
+     "type": "Boolean",
+     "desc": "False to disable resizing (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "wrap",
+     "type": "Boolean",
+     "desc": "True to wrap an element with a div if needed (required for textareas and images, defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "The width of the element in pixels (defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "The height of the element in pixels (defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "animate",
+     "type": "Boolean",
+     "desc": "True to animate the resize (not compatible with dynamic sizing, defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "duration",
+     "type": "Number",
+     "desc": "Animation duration if animate = true (defaults to .35)",
+     "memberOf": ""
+    },
+    {
+     "name": "dynamic",
+     "type": "Boolean",
+     "desc": "True to resize the element while dragging instead of using a proxy (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "handles",
+     "type": "String",
+     "desc": "String consisting of the resize handles to display (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "multiDirectional",
+     "type": "Boolean",
+     "desc": "<b>Deprecated</b>.  The old style of adding multi-direction resize handles, deprecated\nin favor of the handles config option (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableTrackOver",
+     "type": "Boolean",
+     "desc": "True to disable mouse tracking. This is only applied at config time. (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "easing",
+     "type": "String",
+     "desc": "Animation easing if animate = true (defaults to 'easingOutStrong')",
+     "memberOf": ""
+    },
+    {
+     "name": "widthIncrement",
+     "type": "Number",
+     "desc": "The increment to snap the width resize in pixels (dynamic must be true, defaults to 0)",
+     "memberOf": ""
+    },
+    {
+     "name": "heightIncrement",
+     "type": "Number",
+     "desc": "The increment to snap the height resize in pixels (dynamic must be true, defaults to 0)",
+     "memberOf": ""
+    },
+    {
+     "name": "pinned",
+     "type": "Boolean",
+     "desc": "True to ensure that the resize handles are always visible, false to display them only when the\nuser mouses over the resizable borders. This is only applied at config time. (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "preserveRatio",
+     "type": "Boolean",
+     "desc": "True to preserve the original ratio between height and width during resize (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "transparent",
+     "type": "Boolean",
+     "desc": "True for transparent handles. This is only applied at config time. (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "minX",
+     "type": "Number",
+     "desc": "The minimum allowed page X for the element (only used for west resizing, defaults to 0)",
+     "memberOf": ""
+    },
+    {
+     "name": "minY",
+     "type": "Number",
+     "desc": "The minimum allowed page Y for the element (only used for north resizing, defaults to 0)",
+     "memberOf": ""
+    },
+    {
+     "name": "draggable",
+     "type": "Boolean",
+     "desc": "Convenience to initialize drag drop (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "constrainTo",
+     "type": "String/HTMLElement/Element",
+     "desc": "Constrain the resize to a particular element",
+     "memberOf": ""
+    },
+    {
+     "name": "resizeRegion",
+     "type": "Roo.lib.Region",
+     "desc": "Constrain the resize to a particular region",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeresize",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fired before resize is allowed. Set enabled to false to cancel resize."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fired after a resize."
+    }
+   ]
+  },
+  "Roo.Shadow": {
+   "props": [
+    {
+     "name": "mode",
+     "type": "String",
+     "desc": "The shadow display mode.  Supports the following options:<br />\nsides: Shadow displays on both sides and bottom only<br />\nframe: Shadow displays equally on all four sides<br />\ndrop: Traditional bottom-right drop shadow (default)",
+     "memberOf": ""
+    },
+    {
+     "name": "offset",
+     "type": "String",
+     "desc": "The number of pixels to offset the shadow from the element (defaults to 4)",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.SplitBar": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeresize",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the splitter is dragged"
+    },
+    {
+     "name": "moved",
+     "sig": "function (_self, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the splitter is moved"
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the splitter is moved (alias for {@link #event-moved})"
+    }
+   ]
+  },
+  "Roo.SplitBar.AbsoluteLayoutAdapter": {
+   "props": [],
+   "events": []
+  },
+  "Roo.SplitBar.BasicLayoutAdapter": {
+   "props": [],
+   "events": []
+  },
+  "Roo.SplitButton": {
+   "props": [
+    {
+     "name": "arrowHandler",
+     "type": "Function",
+     "desc": "A function called when the arrow button is clicked (can be used instead of click event)",
+     "memberOf": ""
+    },
+    {
+     "name": "arrowTooltip",
+     "type": "String",
+     "desc": "The title attribute of the arrow",
+     "memberOf": ""
+    },
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The button text",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an image to display in the button (the image will be set as the background-image\nCSS property of the button by default, so if you want a mixed icon/text button, set cls:\"x-btn-text-icon\")",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function called when the button is clicked (can be used instead of click event)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "scope",
+     "type": "Object",
+     "desc": "The scope of the handler",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width for this button (used to give a set of buttons a common width)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tooltip",
+     "type": "String/Object",
+     "desc": "The tooltip for the button - can be a string or QuickTips config object",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "True to start hidden (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to start disabled (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "pressed",
+     "type": "Boolean",
+     "desc": "True to start pressed (only if enableToggle = true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "toggleGroup",
+     "type": "String",
+     "desc": "The group this toggle button is a member of (only 1 per group can be pressed, only\n   applies if enableToggle = true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "renderTo",
+     "type": "String/HTMLElement/Element",
+     "desc": "The element to append the button to",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "repeat",
+     "type": "Boolean/Object",
+     "desc": "True to repeat fire the click event while the mouse is down. This can also be\n  an {@link Roo.util.ClickRepeater} config object (defaults to false).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the button's main element.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The DOM tabIndex for this button (defaults to undefined)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "enableToggle",
+     "type": "Boolean",
+     "desc": "True to enable pressed/not pressed toggling (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "menu",
+     "type": "Mixed",
+     "desc": "Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "menuAlign",
+     "type": "String",
+     "desc": "The position to align the menu to (see {@link Roo.Element#alignTo} for more details, defaults to 'tl-bl?').",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "iconCls",
+     "type": "String",
+     "desc": "A css class which sets a background image to be used as the icon for this button (defaults to undefined).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "type",
+     "type": "String",
+     "desc": "The button's type, corresponding to the DOM input element type attribute.  Either \"submit,\" \"reset\" or \"button\" (default).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "clickEvent",
+     "type": "String",
+     "desc": "The type of event to map to the button's event handler (defaults to 'click')",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "handleMouseEvents",
+     "type": "Boolean",
+     "desc": "False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tooltipType",
+     "type": "String",
+     "desc": "The type of tooltip to use. Either \"qtip\" (default) for QuickTips or \"title\" for title attribute.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "template",
+     "type": "Roo.Template",
+     "desc": "(Optional)\nAn {@link Roo.Template} with which to create the Button's main element. This Template must\ncontain numeric substitution parameter 0 if it is to display the tRoo property. Changing the template could\nrequire code modifications if required elements (e.g. a button) aren't present.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "arrowclick",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this button's arrow is clicked"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this button is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits the button"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse hovers over the button"
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the button is rendered"
+    },
+    {
+     "name": "toggle",
+     "sig": "function (_self, pressed)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the \"pressed\" state of this button changes (only if enableToggle = true)"
+    }
+   ]
+  },
+  "Roo.SplitLayoutRegion": {
+   "props": [
+    {
+     "name": "collapsible",
+     "type": "Boolean",
+     "desc": "False to disable collapsing (defaults to true)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "collapsed",
+     "type": "Boolean",
+     "desc": "True to set the initial display to collapsed (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "floatable",
+     "type": "Boolean",
+     "desc": "False to disable floating (defaults to true)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "margins",
+     "type": "Object",
+     "desc": "Margins for the element (defaults to {top: 0, left: 0, right:0, bottom: 0})",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "cmargins",
+     "type": "Object",
+     "desc": "Margins for the element when collapsed (defaults to: north/south {top: 2, left: 0, right:0, bottom: 2} or east/west {top: 0, left: 2, right:2, bottom: 0})",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "tabPosition",
+     "type": "String",
+     "desc": "\"top\" or \"bottom\" (defaults to \"bottom\")",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "collapsedTitle",
+     "type": "String",
+     "desc": "Optional string message to display in the collapsed block of a north or south region",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "alwaysShowTabs",
+     "type": "Boolean",
+     "desc": "True to always display tabs even when there is only 1 panel (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to enable overflow scrolling (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "titlebar",
+     "type": "Boolean",
+     "desc": "True to display a title bar (defaults to true)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "The title for the region (overrides panel titles)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "animate",
+     "type": "Boolean",
+     "desc": "True to animate expand/collapse (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "autoHide",
+     "type": "Boolean",
+     "desc": "False to disable auto hiding when the mouse leaves the \"floated\" region (defaults to true)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "preservePanels",
+     "type": "Boolean",
+     "desc": "True to preserve removed panels so they can be readded later (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "closeOnTab",
+     "type": "Boolean",
+     "desc": "True to place the close icon on the tabs instead of the region titlebar (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "hideTabs",
+     "type": "Boolean",
+     "desc": "True to hide the tab strip (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "resizeTabs",
+     "type": "Boolean",
+     "desc": "True to enable automatic tab resizing. This will resize the tabs so they are all the same size and fit within\nthe space available, similar to FireFox 1.5 tabs (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "minTabWidth",
+     "type": "Number",
+     "desc": "The minimum tab width (defaults to 40)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "preferredTabWidth",
+     "type": "Number",
+     "desc": "The preferred tab width (defaults to 150)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "showPin",
+     "type": "Boolean",
+     "desc": "True to show a pin button",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "True to start the region hidden (defaults to false)",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "hideWhenEmpty",
+     "type": "Boolean",
+     "desc": "True to hide the region when it has no panels",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "disableTabTips",
+     "type": "Boolean",
+     "desc": "True to disable tab tooltips",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "For East/West panels",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "For North/South panels",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "split",
+     "type": "Boolean",
+     "desc": "To show the splitter",
+     "memberOf": "Roo.LayoutRegion"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeremove",
+     "sig": "function (_self, panel, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a panel is removed (or closed). To cancel the removal set \"e.cancel = true\" on the event argument."
+    },
+    {
+     "name": "collapsed",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is collapsed."
+    },
+    {
+     "name": "expanded",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is expanded."
+    },
+    {
+     "name": "invalidated",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the layout for this region is changed."
+    },
+    {
+     "name": "panelactivated",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is activated."
+    },
+    {
+     "name": "paneladded",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is added."
+    },
+    {
+     "name": "panelremoved",
+     "sig": "function (_self, panel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a panel is removed."
+    },
+    {
+     "name": "resized",
+     "sig": "function (_self, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes this region."
+    },
+    {
+     "name": "slidehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region slides out of view."
+    },
+    {
+     "name": "slideshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is slid into view."
+    },
+    {
+     "name": "visibilitychange",
+     "sig": "function (_self, visibility)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this region is shown or hidden"
+    }
+   ]
+  },
+  "Roo.TabPanel": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforetabchange",
+     "sig": "function (_self, e, tab)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the active tab changes, set cancel to true on the \"e\" parameter to cancel the change"
+    },
+    {
+     "name": "tabchange",
+     "sig": "function (_self, activePanel)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the active tab changes"
+    }
+   ]
+  },
+  "Roo.TabPanelItem": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (tabPanel, _self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this tab becomes the active tab."
+    },
+    {
+     "name": "beforeclose",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this tab is closed. To cancel the close, set cancel to true on e (e.cancel = true)."
+    },
+    {
+     "name": "close",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this tab is closed."
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (tabPanel, _self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this tab is no longer the active tab."
+    }
+   ]
+  },
+  "Roo.Template": {
+   "props": [
+    {
+     "name": "html",
+     "type": "String",
+     "desc": "The HTML fragment or an array of fragments to join(\"\") or multiple arguments to join(\"\")",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.Toolbar": {
+   "props": [
+    {
+     "name": "items",
+     "type": "Roo.data.Store",
+     "desc": "array of button configs or elements to add",
+     "memberOf": ""
+    },
+    {
+     "name": "container",
+     "type": "String/HTMLElement/Element",
+     "desc": "The id or element that will contain the toolbar",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.Toolbar.Button": {
+   "props": [
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The button text",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an image to display in the button (the image will be set as the background-image\nCSS property of the button by default, so if you want a mixed icon/text button, set cls:\"x-btn-text-icon\")",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function called when the button is clicked (can be used instead of click event)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "scope",
+     "type": "Object",
+     "desc": "The scope of the handler",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width for this button (used to give a set of buttons a common width)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tooltip",
+     "type": "String/Object",
+     "desc": "The tooltip for the button - can be a string or QuickTips config object",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "True to start hidden (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to start disabled (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "pressed",
+     "type": "Boolean",
+     "desc": "True to start pressed (only if enableToggle = true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "toggleGroup",
+     "type": "String",
+     "desc": "The group this toggle button is a member of (only 1 per group can be pressed, only\n   applies if enableToggle = true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "renderTo",
+     "type": "String/HTMLElement/Element",
+     "desc": "The element to append the button to",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "repeat",
+     "type": "Boolean/Object",
+     "desc": "True to repeat fire the click event while the mouse is down. This can also be\n  an {@link Roo.util.ClickRepeater} config object (defaults to false).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the button's main element.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The DOM tabIndex for this button (defaults to undefined)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "enableToggle",
+     "type": "Boolean",
+     "desc": "True to enable pressed/not pressed toggling (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "menu",
+     "type": "Mixed",
+     "desc": "Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "menuAlign",
+     "type": "String",
+     "desc": "The position to align the menu to (see {@link Roo.Element#alignTo} for more details, defaults to 'tl-bl?').",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "iconCls",
+     "type": "String",
+     "desc": "A css class which sets a background image to be used as the icon for this button (defaults to undefined).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "type",
+     "type": "String",
+     "desc": "The button's type, corresponding to the DOM input element type attribute.  Either \"submit,\" \"reset\" or \"button\" (default).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "clickEvent",
+     "type": "String",
+     "desc": "The type of event to map to the button's event handler (defaults to 'click')",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "handleMouseEvents",
+     "type": "Boolean",
+     "desc": "False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tooltipType",
+     "type": "String",
+     "desc": "The type of tooltip to use. Either \"qtip\" (default) for QuickTips or \"title\" for title attribute.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "template",
+     "type": "Roo.Template",
+     "desc": "(Optional)\nAn {@link Roo.Template} with which to create the Button's main element. This Template must\ncontain numeric substitution parameter 0 if it is to display the tRoo property. Changing the template could\nrequire code modifications if required elements (e.g. a button) aren't present.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this button is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits the button"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse hovers over the button"
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the button is rendered"
+    },
+    {
+     "name": "toggle",
+     "sig": "function (_self, pressed)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the \"pressed\" state of this button changes (only if enableToggle = true)"
+    }
+   ]
+  },
+  "Roo.Toolbar.Fill": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Toolbar.Item": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Toolbar.Separator": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Toolbar.Spacer": {
+   "props": [],
+   "events": []
+  },
+  "Roo.Toolbar.SplitButton": {
+   "props": [
+    {
+     "name": "arrowHandler",
+     "type": "Function",
+     "desc": "A function called when the arrow button is clicked (can be used instead of click event)",
+     "memberOf": "Roo.SplitButton"
+    },
+    {
+     "name": "arrowTooltip",
+     "type": "String",
+     "desc": "The title attribute of the arrow",
+     "memberOf": "Roo.SplitButton"
+    },
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The button text",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an image to display in the button (the image will be set as the background-image\nCSS property of the button by default, so if you want a mixed icon/text button, set cls:\"x-btn-text-icon\")",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function called when the button is clicked (can be used instead of click event)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "scope",
+     "type": "Object",
+     "desc": "The scope of the handler",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width for this button (used to give a set of buttons a common width)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tooltip",
+     "type": "String/Object",
+     "desc": "The tooltip for the button - can be a string or QuickTips config object",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "True to start hidden (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to start disabled (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "pressed",
+     "type": "Boolean",
+     "desc": "True to start pressed (only if enableToggle = true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "toggleGroup",
+     "type": "String",
+     "desc": "The group this toggle button is a member of (only 1 per group can be pressed, only\n   applies if enableToggle = true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "renderTo",
+     "type": "String/HTMLElement/Element",
+     "desc": "The element to append the button to",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "repeat",
+     "type": "Boolean/Object",
+     "desc": "True to repeat fire the click event while the mouse is down. This can also be\n  an {@link Roo.util.ClickRepeater} config object (defaults to false).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the button's main element.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The DOM tabIndex for this button (defaults to undefined)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "enableToggle",
+     "type": "Boolean",
+     "desc": "True to enable pressed/not pressed toggling (defaults to false)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "menu",
+     "type": "Mixed",
+     "desc": "Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "menuAlign",
+     "type": "String",
+     "desc": "The position to align the menu to (see {@link Roo.Element#alignTo} for more details, defaults to 'tl-bl?').",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "iconCls",
+     "type": "String",
+     "desc": "A css class which sets a background image to be used as the icon for this button (defaults to undefined).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "type",
+     "type": "String",
+     "desc": "The button's type, corresponding to the DOM input element type attribute.  Either \"submit,\" \"reset\" or \"button\" (default).",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "clickEvent",
+     "type": "String",
+     "desc": "The type of event to map to the button's event handler (defaults to 'click')",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "handleMouseEvents",
+     "type": "Boolean",
+     "desc": "False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "tooltipType",
+     "type": "String",
+     "desc": "The type of tooltip to use. Either \"qtip\" (default) for QuickTips or \"title\" for title attribute.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "template",
+     "type": "Roo.Template",
+     "desc": "(Optional)\nAn {@link Roo.Template} with which to create the Button's main element. This Template must\ncontain numeric substitution parameter 0 if it is to display the tRoo property. Changing the template could\nrequire code modifications if required elements (e.g. a button) aren't present.",
+     "memberOf": "Roo.Button"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "arrowclick",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this button's arrow is clicked"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this button is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits the button"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse hovers over the button"
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the button is rendered"
+    },
+    {
+     "name": "toggle",
+     "sig": "function (_self, pressed)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the \"pressed\" state of this button changes (only if enableToggle = true)"
+    }
+   ]
+  },
+  "Roo.Toolbar.TextItem": {
+   "props": [],
+   "events": []
+  },
+  "Roo.TreePanel": {
+   "props": [
+    {
+     "name": "tree",
+     "type": "Roo.tree.TreePanel",
+     "desc": "The tree TreePanel, with config etc.",
+     "memberOf": ""
+    },
+    {
+     "name": "fitToFrame",
+     "type": "Boolean",
+     "desc": "True for this panel to adjust its size to fit when the region resizes  (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "fitContainer",
+     "type": "Boolean",
+     "desc": "When using {@link #fitToFrame} and {@link #resizeEl}, you can also fit the parent container  (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "autoCreate",
+     "type": "Boolean/Object",
+     "desc": "True to auto generate the DOM element for this panel, or a {@link Roo.DomHelper} config of the element to create",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "closable",
+     "type": "Boolean",
+     "desc": "True if the panel can be closed/removed",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "background",
+     "type": "Boolean",
+     "desc": "True if the panel should not be activated when it is added (defaults to false)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "resizeEl",
+     "type": "String/HTMLElement/Element",
+     "desc": "An element to resize if {@link #fitToFrame} is true (instead of this panel's element)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "toolbar",
+     "type": "Toolbar",
+     "desc": "A toolbar for this panel",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "autoScroll",
+     "type": "Boolean",
+     "desc": "True to scroll overflow in this panel (use with {@link #fitToFrame})",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "The title for this panel",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "adjustments",
+     "type": "Array",
+     "desc": "Values to <b>add</b> to the width/height when doing a {@link #fitToFrame} (default is [0, 0])",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "Calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "region",
+     "type": "String",
+     "desc": "(center|north|south|east|west) which region to put this panel on (when used with xtype constructors)",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "params",
+     "type": "String/Object",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "loadOnce",
+     "type": "Boolean",
+     "desc": "When used with {@link #url}, calls {@link #setUrl} with this value",
+     "memberOf": "Roo.ContentPanel"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is activated."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, width, height)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this panel is resized if fitToFrame is true."
+    }
+   ]
+  },
+  "Roo.UpdateManager": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeupdate",
+     "sig": "function (el, url, params)\n{\n\n}",
+     "type": "function",
+     "desc": "Fired before an update is made, return false from your handler and the update is cancelled."
+    },
+    {
+     "name": "failure",
+     "sig": "function (el, oResponseObject)\n{\n\n}",
+     "type": "function",
+     "desc": "Fired on update failure."
+    },
+    {
+     "name": "update",
+     "sig": "function (el, oResponseObject)\n{\n\n}",
+     "type": "function",
+     "desc": "Fired after successful update is made."
+    }
+   ]
+  },
+  "Roo.UpdateManager.BasicRenderer": {
+   "props": [],
+   "events": []
+  },
+  "Roo.UpdateManager.defaults": {
+   "props": [],
+   "events": []
+  },
+  "Roo.View": {
+   "props": [
+    {
+     "name": "store",
+     "type": "Roo.data.Store",
+     "desc": "Data store to load data from.",
+     "memberOf": ""
+    },
+    {
+     "name": "el",
+     "type": "String|Roo.Element",
+     "desc": "The container element.",
+     "memberOf": ""
+    },
+    {
+     "name": "tpl",
+     "type": "String|Roo.Template",
+     "desc": "The template used by this View",
+     "memberOf": ""
+    },
+    {
+     "name": "selectedClass",
+     "type": "String",
+     "desc": "The css class to add to selected nodes",
+     "memberOf": ""
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The empty text to show when nothing is loaded.",
+     "memberOf": ""
+    },
+    {
+     "name": "multiSelect",
+     "type": "Boolean",
+     "desc": "Allow multiple selection",
+     "memberOf": ""
+    },
+    {
+     "name": "singleSelect",
+     "type": "Boolean",
+     "desc": "Allow single selection",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeclick",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a click is processed. Returns false to cancel the default action."
+    },
+    {
+     "name": "beforeselect",
+     "sig": "function (_self, node, selections)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a selection is made. If any handlers return false, the selection is cancelled."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a template node is clicked."
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a template node is right clicked."
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (_self, index, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a template node is double clicked."
+    },
+    {
+     "name": "selectionchange",
+     "sig": "function (_self, selections)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the selected nodes change."
+    }
+   ]
+  },
+  "Roo.XComponent": {
+   "props": [
+    {
+     "name": "disabled",
+     "type": "Function|boolean",
+     "desc": "If this module is disabled by some rule, return true from the funtion",
+     "memberOf": ""
+    },
+    {
+     "name": "parent",
+     "type": "String",
+     "desc": "Name of parent element which it get xtype added to..",
+     "memberOf": ""
+    },
+    {
+     "name": "order",
+     "type": "String",
+     "desc": "Used to set the order in which elements are created (usefull for multiple tabs)",
+     "memberOf": ""
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "String to display while loading.",
+     "memberOf": ""
+    },
+    {
+     "name": "items",
+     "type": "Array",
+     "desc": "A single item array - the first element is the root of the tree..\nIt's done this way to stay compatible with the Xtype system...",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "buildcomplete",
+     "sig": "function (c)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires on the top level element when all elements have been built"
+    },
+    {
+     "name": "built",
+     "sig": "function (c)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this the componnt is built"
+    }
+   ]
+  },
+  "Roo.data": {
+   "props": [],
+   "events": []
+  },
+  "Roo.data.ArrayReader": {
+   "props": [
+    {
+     "name": "id",
+     "type": "String",
+     "desc": "(optional) The subscript within row Array that provides an ID for the Record",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.data.Connection": {
+   "props": [
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "(Optional) The default URL to be used for requests to the server. (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "extraParams",
+     "type": "Object",
+     "desc": "(Optional) An object containing properties which are used as\nextra parameters to each request made by this object. (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "defaultHeaders",
+     "type": "Object",
+     "desc": "(Optional) An object containing request headers which are added\n to each request made by this object. (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "method",
+     "type": "String",
+     "desc": "(Optional) The default HTTP method to be used for requests. (defaults to undefined; if not set but parms are present will use POST, otherwise GET)",
+     "memberOf": ""
+    },
+    {
+     "name": "timeout",
+     "type": "Number",
+     "desc": "(Optional) The timeout in milliseconds to be used for requests. (defaults to 30000)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoAbort",
+     "type": "Boolean",
+     "desc": "(Optional) Whether this request should abort any pending requests. (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableCaching",
+     "type": "Boolean",
+     "desc": "(Optional) True to add a unique cache-buster param to GET requests. (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforerequest",
+     "sig": "function (conn, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a network request is made to retrieve a data object."
+    },
+    {
+     "name": "requestcomplete",
+     "sig": "function (conn, response, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if the request was successfully completed."
+    },
+    {
+     "name": "requestexception",
+     "sig": "function (conn, response, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an error HTTP status was returned from the server.\nSee {@link http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html} for details of HTTP status codes."
+    }
+   ]
+  },
+  "Roo.data.DataProxy": {
+   "props": [],
+   "events": [
+    {
+     "name": "beforeload",
+     "sig": "function (This, params)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a network request is made to retrieve a data object."
+    },
+    {
+     "name": "load",
+     "sig": "function (This, o, arg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the load method's callback is called."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (This, o, arg, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an Exception occurs during data retrieval."
+    }
+   ]
+  },
+  "Roo.data.DataReader": {
+   "props": [],
+   "events": []
+  },
+  "Roo.data.HttpProxy": {
+   "props": [
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "(Optional) The default URL to be used for requests to the server. (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "extraParams",
+     "type": "Object",
+     "desc": "(Optional) An object containing properties which are used as\nextra parameters to each request made by this object. (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "defaultHeaders",
+     "type": "Object",
+     "desc": "(Optional) An object containing request headers which are added\n to each request made by this object. (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "method",
+     "type": "String",
+     "desc": "(Optional) The default HTTP method to be used for requests. (defaults to undefined; if not set but parms are present will use POST, otherwise GET)",
+     "memberOf": ""
+    },
+    {
+     "name": "timeout",
+     "type": "Number",
+     "desc": "(Optional) The timeout in milliseconds to be used for requests. (defaults to 30000)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoAbort",
+     "type": "Boolean",
+     "desc": "(Optional) Whether this request should abort any pending requests. (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableCaching",
+     "type": "Boolean",
+     "desc": "(Optional) True to add a unique cache-buster param to GET requests. (defaults to true)",
+     "memberOf": ""
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeload",
+     "sig": "function (This, params)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a network request is made to retrieve a data object."
+    },
+    {
+     "name": "load",
+     "sig": "function (This, o, arg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the load method's callback is called."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (This, o, arg, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an Exception occurs during data retrieval."
+    }
+   ]
+  },
+  "Roo.data.JsonReader": {
+   "props": [
+    {
+     "name": "totalProperty",
+     "type": "String",
+     "desc": "Name of the property from which to retrieve the total number of records\nin the dataset. This is only needed if the whole dataset is not passed in one go, but is being\npaged from the remote server.",
+     "memberOf": ""
+    },
+    {
+     "name": "successProperty",
+     "type": "String",
+     "desc": "Name of the property from which to retrieve the success attribute used by forms.",
+     "memberOf": ""
+    },
+    {
+     "name": "root",
+     "type": "String",
+     "desc": "name of the property which contains the Array of row objects.",
+     "memberOf": ""
+    },
+    {
+     "name": "id",
+     "type": "String",
+     "desc": "Name of the property within a row object that contains a record identifier value.",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.data.JsonStore": {
+   "props": [
+    {
+     "name": "fields",
+     "type": "Array",
+     "desc": "An array of field definition objects, or field name strings.",
+     "memberOf": ""
+    },
+    {
+     "name": "isLocal",
+     "type": "boolean",
+     "desc": "flag if data is locally available (and can be always looked up\nwithout a remote query - used by combo/forms at present.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "proxy",
+     "type": "Roo.data.DataProxy",
+     "desc": "The Proxy object which provides access to a data object.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "data",
+     "type": "Array",
+     "desc": "Inline data to be loaded when the store is initialized.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "reader",
+     "type": "Roo.data.Reader",
+     "desc": "The Reader object which processes the data object and returns\nan Array of Roo.data.record objects which are cached keyed by their <em>id</em> property.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "baseParams",
+     "type": "Object",
+     "desc": "An object containing properties which are to be sent as parameters\non any HTTP request",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "sortInfo",
+     "type": "Object",
+     "desc": "A config object in the format: {field: \"fieldName\", direction: \"ASC|DESC\"}",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "remoteSort",
+     "type": "boolean",
+     "desc": "True if sorting is to be handled by requesting the Proxy to provide a refreshed\nversion of the data object in sorted order, as opposed to sorting the Record cache in place (defaults to false).",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "pruneModifiedRecords",
+     "type": "boolean",
+     "desc": "True to clear all modified record information each time the store is\nloaded or when a record is removed. (defaults to false).",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "add",
+     "sig": "function (_self, records, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when Records have been added to the Store"
+    },
+    {
+     "name": "beforeload",
+     "sig": "function (_self, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a request is made for a new data object.  If the beforeload handler returns false\nthe load action will be canceled."
+    },
+    {
+     "name": "clear",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the data cache has been cleared."
+    },
+    {
+     "name": "datachanged",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the data cache has changed, and a widget which is using this Store\nas a Record cache should refresh its view."
+    },
+    {
+     "name": "load",
+     "sig": "function (_self, records, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a new set of Records has been loaded."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (, return, load, jsonData)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an exception occurs in the Proxy during loading.\nCalled with the signature of the Proxy's \"loadexception\" event.\nIf you return Json { data: [] , success: false, .... } then this will be thrown with the following args"
+    },
+    {
+     "name": "metachange",
+     "sig": "function (_self, meta)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this store's reader provides new metadata (fields). This is currently only support for JsonReaders."
+    },
+    {
+     "name": "remove",
+     "sig": "function (_self, record, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a Record has been removed from the Store"
+    },
+    {
+     "name": "update",
+     "sig": "function (_self, record, operation)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a Record has been updated"
+    }
+   ]
+  },
+  "Roo.data.MemoryProxy": {
+   "props": [],
+   "events": []
+  },
+  "Roo.data.Node": {
+   "props": [
+    {
+     "name": "leaf",
+     "type": "Boolean",
+     "desc": "true if this node is a leaf and does not have children",
+     "memberOf": ""
+    },
+    {
+     "name": "id",
+     "type": "String",
+     "desc": "The id for this node. If one is not specified, one is generated.",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "append",
+     "sig": "function (tree, _self, node, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is appended"
+    },
+    {
+     "name": "beforeappend",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is appended, return false to cancel the append."
+    },
+    {
+     "name": "beforeinsert",
+     "sig": "function (tree, _self, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is inserted, return false to cancel the insert."
+    },
+    {
+     "name": "beforemove",
+     "sig": "function (tree, _self, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is moved to a new location in the tree. Return false to cancel the move."
+    },
+    {
+     "name": "beforeremove",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a child is removed, return false to cancel the remove."
+    },
+    {
+     "name": "insert",
+     "sig": "function (tree, _self, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is inserted."
+    },
+    {
+     "name": "move",
+     "sig": "function (tree, _self, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is moved to a new location in the tree"
+    },
+    {
+     "name": "remove",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a child node is removed"
+    }
+   ]
+  },
+  "Roo.data.Record": {
+   "props": [],
+   "events": []
+  },
+  "Roo.data.ScriptTagProxy": {
+   "props": [
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "The URL from which to request the data object.",
+     "memberOf": ""
+    },
+    {
+     "name": "timeout",
+     "type": "Number",
+     "desc": "(Optional) The number of milliseconds to wait for a response. Defaults to 30 seconds.",
+     "memberOf": ""
+    },
+    {
+     "name": "callbackParam",
+     "type": "String",
+     "desc": "(Optional) The name of the parameter to pass to the server which tells\nthe server the name of the callback function set up by the load call to process the returned data object.\nDefaults to \"callback\".<p>The server-side processing must read this parameter value, and generate\njavascript output which calls this named function passing the data object as its only parameter.",
+     "memberOf": ""
+    },
+    {
+     "name": "nocache",
+     "type": "Boolean",
+     "desc": "(Optional) Defaults to true. Disable cacheing by adding a unique parameter\nname to the request.",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.data.SimpleStore": {
+   "props": [
+    {
+     "name": "id",
+     "type": "Number",
+     "desc": "The array index of the record id. Leave blank to auto generate ids.",
+     "memberOf": ""
+    },
+    {
+     "name": "fields",
+     "type": "Array",
+     "desc": "An array of field definition objects, or field name strings.",
+     "memberOf": ""
+    },
+    {
+     "name": "data",
+     "type": "Array",
+     "desc": "The multi-dimensional array of data",
+     "memberOf": ""
+    },
+    {
+     "name": "isLocal",
+     "type": "boolean",
+     "desc": "flag if data is locally available (and can be always looked up\nwithout a remote query - used by combo/forms at present.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "proxy",
+     "type": "Roo.data.DataProxy",
+     "desc": "The Proxy object which provides access to a data object.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "reader",
+     "type": "Roo.data.Reader",
+     "desc": "The Reader object which processes the data object and returns\nan Array of Roo.data.record objects which are cached keyed by their <em>id</em> property.",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "baseParams",
+     "type": "Object",
+     "desc": "An object containing properties which are to be sent as parameters\non any HTTP request",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "sortInfo",
+     "type": "Object",
+     "desc": "A config object in the format: {field: \"fieldName\", direction: \"ASC|DESC\"}",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "remoteSort",
+     "type": "boolean",
+     "desc": "True if sorting is to be handled by requesting the Proxy to provide a refreshed\nversion of the data object in sorted order, as opposed to sorting the Record cache in place (defaults to false).",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "pruneModifiedRecords",
+     "type": "boolean",
+     "desc": "True to clear all modified record information each time the store is\nloaded or when a record is removed. (defaults to false).",
+     "memberOf": "Roo.data.Store"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "add",
+     "sig": "function (_self, records, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when Records have been added to the Store"
+    },
+    {
+     "name": "beforeload",
+     "sig": "function (_self, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a request is made for a new data object.  If the beforeload handler returns false\nthe load action will be canceled."
+    },
+    {
+     "name": "clear",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the data cache has been cleared."
+    },
+    {
+     "name": "datachanged",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the data cache has changed, and a widget which is using this Store\nas a Record cache should refresh its view."
+    },
+    {
+     "name": "load",
+     "sig": "function (_self, records, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a new set of Records has been loaded."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (, return, load, jsonData)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an exception occurs in the Proxy during loading.\nCalled with the signature of the Proxy's \"loadexception\" event.\nIf you return Json { data: [] , success: false, .... } then this will be thrown with the following args"
+    },
+    {
+     "name": "metachange",
+     "sig": "function (_self, meta)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this store's reader provides new metadata (fields). This is currently only support for JsonReaders."
+    },
+    {
+     "name": "remove",
+     "sig": "function (_self, record, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a Record has been removed from the Store"
+    },
+    {
+     "name": "update",
+     "sig": "function (_self, record, operation)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a Record has been updated"
+    }
+   ]
+  },
+  "Roo.data.SortTypes": {
+   "props": [],
+   "events": []
+  },
+  "Roo.data.Store": {
+   "props": [
+    {
+     "name": "isLocal",
+     "type": "boolean",
+     "desc": "flag if data is locally available (and can be always looked up\nwithout a remote query - used by combo/forms at present.",
+     "memberOf": ""
+    },
+    {
+     "name": "proxy",
+     "type": "Roo.data.DataProxy",
+     "desc": "The Proxy object which provides access to a data object.",
+     "memberOf": ""
+    },
+    {
+     "name": "data",
+     "type": "Array",
+     "desc": "Inline data to be loaded when the store is initialized.",
+     "memberOf": ""
+    },
+    {
+     "name": "reader",
+     "type": "Roo.data.Reader",
+     "desc": "The Reader object which processes the data object and returns\nan Array of Roo.data.record objects which are cached keyed by their <em>id</em> property.",
+     "memberOf": ""
+    },
+    {
+     "name": "baseParams",
+     "type": "Object",
+     "desc": "An object containing properties which are to be sent as parameters\non any HTTP request",
+     "memberOf": ""
+    },
+    {
+     "name": "sortInfo",
+     "type": "Object",
+     "desc": "A config object in the format: {field: \"fieldName\", direction: \"ASC|DESC\"}",
+     "memberOf": ""
+    },
+    {
+     "name": "remoteSort",
+     "type": "boolean",
+     "desc": "True if sorting is to be handled by requesting the Proxy to provide a refreshed\nversion of the data object in sorted order, as opposed to sorting the Record cache in place (defaults to false).",
+     "memberOf": ""
+    },
+    {
+     "name": "pruneModifiedRecords",
+     "type": "boolean",
+     "desc": "True to clear all modified record information each time the store is\nloaded or when a record is removed. (defaults to false).",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "add",
+     "sig": "function (_self, records, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when Records have been added to the Store"
+    },
+    {
+     "name": "beforeload",
+     "sig": "function (_self, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a request is made for a new data object.  If the beforeload handler returns false\nthe load action will be canceled."
+    },
+    {
+     "name": "clear",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the data cache has been cleared."
+    },
+    {
+     "name": "datachanged",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the data cache has changed, and a widget which is using this Store\nas a Record cache should refresh its view."
+    },
+    {
+     "name": "load",
+     "sig": "function (_self, records, options)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a new set of Records has been loaded."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (, return, load, jsonData)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if an exception occurs in the Proxy during loading.\nCalled with the signature of the Proxy's \"loadexception\" event.\nIf you return Json { data: [] , success: false, .... } then this will be thrown with the following args"
+    },
+    {
+     "name": "metachange",
+     "sig": "function (_self, meta)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this store's reader provides new metadata (fields). This is currently only support for JsonReaders."
+    },
+    {
+     "name": "remove",
+     "sig": "function (_self, record, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a Record has been removed from the Store"
+    },
+    {
+     "name": "update",
+     "sig": "function (_self, record, operation)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a Record has been updated"
+    }
+   ]
+  },
+  "Roo.data.Tree": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "append",
+     "sig": "function (tree, parent, node, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is appended to a node in this tree."
+    },
+    {
+     "name": "beforeappend",
+     "sig": "function (tree, parent, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is appended to a node in this tree, return false to cancel the append."
+    },
+    {
+     "name": "beforeinsert",
+     "sig": "function (tree, parent, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is inserted in a node in this tree, return false to cancel the insert."
+    },
+    {
+     "name": "beforemove",
+     "sig": "function (tree, node, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a node is moved to a new location in the tree. Return false to cancel the move."
+    },
+    {
+     "name": "beforeremove",
+     "sig": "function (tree, parent, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a child is removed from a node in this tree, return false to cancel the remove."
+    },
+    {
+     "name": "insert",
+     "sig": "function (tree, parent, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is inserted in a node in this tree."
+    },
+    {
+     "name": "move",
+     "sig": "function (tree, node, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is moved to a new location in the tree"
+    },
+    {
+     "name": "remove",
+     "sig": "function (tree, parent, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a child node is removed from a node in this tree."
+    }
+   ]
+  },
+  "Roo.data.XmlReader": {
+   "props": [
+    {
+     "name": "totalRecords",
+     "type": "String",
+     "desc": "The DomQuery path from which to retrieve the total number of records\nin the dataset. This is only needed if the whole dataset is not passed in one go, but is being\npaged from the remote server.",
+     "memberOf": ""
+    },
+    {
+     "name": "record",
+     "type": "String",
+     "desc": "The DomQuery path to the repeated element which contains record information.",
+     "memberOf": ""
+    },
+    {
+     "name": "success",
+     "type": "String",
+     "desc": "The DomQuery path to the success attribute used by forms.",
+     "memberOf": ""
+    },
+    {
+     "name": "id",
+     "type": "String",
+     "desc": "The DomQuery path relative from the record element to the element that contains\na record identifier value.",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.dd": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.DD": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.DDProxy": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.DDTarget": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.DragDrop": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.DragDropMgr": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.DragSource": {
+   "props": [
+    {
+     "name": "dropAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is allowed (defaults to \"x-dd-drop-ok\").",
+     "memberOf": ""
+    },
+    {
+     "name": "dropNotAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is not allowed (defaults to \"x-dd-drop-nodrop\").",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.dd.DragZone": {
+   "props": [
+    {
+     "name": "containerScroll",
+     "type": "Boolean",
+     "desc": "True to register this container with the Scrollmanager\nfor auto scrolling during drag operations.",
+     "memberOf": ""
+    },
+    {
+     "name": "hlColor",
+     "type": "String",
+     "desc": "The color to use when visually highlighting the drag source in the afterRepair\nmethod after a failed drop (defaults to \"c3daf9\" - light blue)",
+     "memberOf": ""
+    },
+    {
+     "name": "dropAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is allowed (defaults to \"x-dd-drop-ok\").",
+     "memberOf": "Roo.dd.DragSource"
+    },
+    {
+     "name": "dropNotAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is not allowed (defaults to \"x-dd-drop-nodrop\").",
+     "memberOf": "Roo.dd.DragSource"
+    }
+   ],
+   "events": []
+  },
+  "Roo.dd.DropTarget": {
+   "props": [
+    {
+     "name": "overClass",
+     "type": "String",
+     "desc": "The CSS class applied to the drop target element while the drag source is over it (defaults to \"\").",
+     "memberOf": ""
+    },
+    {
+     "name": "dropAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is allowed (defaults to \"x-dd-drop-ok\").",
+     "memberOf": ""
+    },
+    {
+     "name": "dropNotAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is not allowed (defaults to \"x-dd-drop-nodrop\").",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.dd.DropZone": {
+   "props": [
+    {
+     "name": "overClass",
+     "type": "String",
+     "desc": "The CSS class applied to the drop target element while the drag source is over it (defaults to \"\").",
+     "memberOf": "Roo.dd.DropTarget"
+    },
+    {
+     "name": "dropAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is allowed (defaults to \"x-dd-drop-ok\").",
+     "memberOf": "Roo.dd.DropTarget"
+    },
+    {
+     "name": "dropNotAllowed",
+     "type": "String",
+     "desc": "The CSS class returned to the drag source when drop is not allowed (defaults to \"x-dd-drop-nodrop\").",
+     "memberOf": "Roo.dd.DropTarget"
+    }
+   ],
+   "events": []
+  },
+  "Roo.dd.Registry": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.ScrollManager": {
+   "props": [],
+   "events": []
+  },
+  "Roo.dd.StatusProxy": {
+   "props": [
+    {
+     "name": "dropAllowed",
+     "type": "String",
+     "desc": "The CSS class to apply to the status element when drop is allowed (defaults to \"x-dd-drop-ok\").",
+     "memberOf": ""
+    },
+    {
+     "name": "dropNotAllowed",
+     "type": "String",
+     "desc": "The CSS class to apply to the status element when drop is not allowed (defaults to \"x-dd-drop-nodrop\").",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.form": {
+   "props": [],
+   "events": []
+  },
+  "Roo.form.Action": {
+   "props": [],
+   "events": []
+  },
+  "Roo.form.BasicForm": {
+   "props": [
+    {
+     "name": "method",
+     "type": "String",
+     "desc": "The request method to use (GET or POST) for form actions if one isn't supplied in the action options.",
+     "memberOf": ""
+    },
+    {
+     "name": "reader",
+     "type": "DataReader",
+     "desc": "An Roo.data.DataReader (e.g. {@link Roo.data.XmlReader}) to be used to read data when executing \"load\" actions.\nThis is optional as there is built-in support for processing JSON.",
+     "memberOf": ""
+    },
+    {
+     "name": "errorReader",
+     "type": "DataReader",
+     "desc": "An Roo.data.DataReader (e.g. {@link Roo.data.XmlReader}) to be used to read data when reading validation errors on \"submit\" actions.\nThis is completely optional as there is built-in support for processing JSON.",
+     "memberOf": ""
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "The URL to use for form actions if one isn't supplied in the action options.",
+     "memberOf": ""
+    },
+    {
+     "name": "fileUpload",
+     "type": "Boolean",
+     "desc": "Set to true if this form is a file upload.",
+     "memberOf": ""
+    },
+    {
+     "name": "baseParams",
+     "type": "Object",
+     "desc": "Parameters to pass with all requests. e.g. baseParams: {id: '123', foo: 'bar'}.",
+     "memberOf": ""
+    },
+    {
+     "name": "timeout",
+     "type": "Number",
+     "desc": "Timeout for form actions in seconds (default is 30 seconds).",
+     "memberOf": ""
+    },
+    {
+     "name": "trackResetOnLoad",
+     "type": "Boolean",
+     "desc": "If set to true, form.reset() resets to the last loaded\nor setValues() data instead of when the form was first created.",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "actioncomplete",
+     "sig": "function (_self, action)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an action is completed."
+    },
+    {
+     "name": "actionfailed",
+     "sig": "function (_self, action)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an action fails."
+    },
+    {
+     "name": "beforeaction",
+     "sig": "function (_self, action)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before any action is performed. Return false to cancel the action."
+    }
+   ]
+  },
+  "Roo.form.Checkbox": {
+   "props": [
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the checkbox receives focus (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the checkbox (defaults to \"x-form-field\")",
+     "memberOf": ""
+    },
+    {
+     "name": "checked",
+     "type": "Boolean",
+     "desc": "True if the the checkbox should render already checked (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"checkbox\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "boxLabel",
+     "type": "String",
+     "desc": "The text that appears beside the checkbox",
+     "memberOf": ""
+    },
+    {
+     "name": "inputValue",
+     "type": "String",
+     "desc": "The value that should go into the generated input element's value attribute",
+     "memberOf": ""
+    },
+    {
+     "name": "valueOff",
+     "type": "String",
+     "desc": "The value that should go into the generated input element's value when unchecked.",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "check",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the checkbox is checked or unchecked."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.Column": {
+   "props": [
+    {
+     "name": "width",
+     "type": "Number/String",
+     "desc": "The fixed width of the column in pixels or CSS value (defaults to \"auto\")",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec used to autocreate the column (defaults to {tag: 'div', cls: 'x-form-ct x-form-column'})",
+     "memberOf": ""
+    },
+    {
+     "name": "style",
+     "type": "String/Object/Function",
+     "desc": "A style specification string, e.g. \"width:100px\", or object in the form {width:\"100px\"}, or\na function which returns such a specification.",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"top\" and \"right\" (defaults to \"left\")",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelWidth",
+     "type": "Number",
+     "desc": "Fixed width in pixels of all field labels (defaults to undefined)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "clear",
+     "type": "Boolean",
+     "desc": "True to add a clearing element at the end of this layout, equivalent to CSS clear: both (defaults to true)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelSeparator",
+     "type": "String",
+     "desc": "The separator to use after field labels (defaults to ':')",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "hideLabels",
+     "type": "Boolean",
+     "desc": "True to suppress the display of field labels in this layout (defaults to false)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.form.ComboBox": {
+   "props": [
+    {
+     "name": "transform",
+     "type": "String/HTMLElement/Element",
+     "desc": "The id, DOM node or element of an existing select to convert to a ComboBox",
+     "memberOf": ""
+    },
+    {
+     "name": "lazyRender",
+     "type": "Boolean",
+     "desc": "True to prevent the ComboBox from rendering until requested (should always be used when\nrendering into an Roo.Editor, defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "Boolean/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to:\n{tag: \"input\", type: \"text\", size: \"24\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "store",
+     "type": "Roo.data.Store",
+     "desc": "The data store to which this combo is bound (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "title",
+     "type": "String",
+     "desc": "If supplied, a header element is created containing this text and added into the top of\nthe dropdown list (defaults to undefined, with no header element)",
+     "memberOf": ""
+    },
+    {
+     "name": "grow",
+     "type": "Boolean",
+     "desc": "",
+     "memberOf": ""
+    },
+    {
+     "name": "growMin",
+     "type": "Number",
+     "desc": "",
+     "memberOf": ""
+    },
+    {
+     "name": "growMax",
+     "type": "Number",
+     "desc": "",
+     "memberOf": ""
+    },
+    {
+     "name": "tpl",
+     "type": "String/Roo.Template",
+     "desc": "The template to use to render the output",
+     "memberOf": ""
+    },
+    {
+     "name": "listWidth",
+     "type": "Number",
+     "desc": "The width in pixels of the dropdown list (defaults to the width of the ComboBox field)",
+     "memberOf": ""
+    },
+    {
+     "name": "displayField",
+     "type": "String",
+     "desc": "The underlying data field name to bind to this CombBox (defaults to undefined if\nmode = 'remote' or 'text' if mode = 'local')",
+     "memberOf": ""
+    },
+    {
+     "name": "valueField",
+     "type": "String",
+     "desc": "The underlying data value name to bind to this CombBox (defaults to undefined if\nmode = 'remote' or 'value' if mode = 'local'). \nNote: use of a valueField requires the user make a selection\nin order for a value to be mapped.",
+     "memberOf": ""
+    },
+    {
+     "name": "hiddenName",
+     "type": "String",
+     "desc": "If specified, a hidden form field with this name is dynamically generated to store the\nfield's data value (defaults to the underlying DOM element's name)",
+     "memberOf": ""
+    },
+    {
+     "name": "listClass",
+     "type": "String",
+     "desc": "CSS class to apply to the dropdown list element (defaults to '')",
+     "memberOf": ""
+    },
+    {
+     "name": "selectedClass",
+     "type": "String",
+     "desc": "CSS class to apply to the selected item in the dropdown list (defaults to 'x-combo-selected')",
+     "memberOf": ""
+    },
+    {
+     "name": "triggerClass",
+     "type": "String",
+     "desc": "An additional CSS class used to style the trigger button.  The trigger will always get the\nclass 'x-form-trigger' and triggerClass will be <b>appended</b> if specified (defaults to 'x-form-arrow-trigger'\nwhich displays a downward arrow icon).",
+     "memberOf": ""
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\" for bottom-right",
+     "memberOf": ""
+    },
+    {
+     "name": "listAlign",
+     "type": "String",
+     "desc": "A valid anchor position value. See {@link Roo.Element#alignTo} for details on supported\nanchor positions (defaults to 'tl-bl')",
+     "memberOf": ""
+    },
+    {
+     "name": "maxHeight",
+     "type": "Number",
+     "desc": "The maximum height in pixels of the dropdown list before scrollbars are shown (defaults to 300)",
+     "memberOf": ""
+    },
+    {
+     "name": "triggerAction",
+     "type": "String",
+     "desc": "The action to execute when the trigger field is activated.  Use 'all' to run the\nquery specified by the allQuery config option (defaults to 'query')",
+     "memberOf": ""
+    },
+    {
+     "name": "minChars",
+     "type": "Number",
+     "desc": "The minimum number of characters the user must type before autocomplete and typeahead activate\n(defaults to 4, does not apply if editable = false)",
+     "memberOf": ""
+    },
+    {
+     "name": "typeAhead",
+     "type": "Boolean",
+     "desc": "True to populate and autoselect the remainder of the text being typed after a configurable\ndelay (typeAheadDelay) if it matches a known value (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "queryDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds to delay between the start of typing and sending the\nquery to filter the dropdown list (defaults to 500 if mode = 'remote' or 10 if mode = 'local')",
+     "memberOf": ""
+    },
+    {
+     "name": "pageSize",
+     "type": "Number",
+     "desc": "If greater than 0, a paging toolbar is displayed in the footer of the dropdown list and the\nfilter queries will execute with page start and limit parameters.  Only applies when mode = 'remote' (defaults to 0)",
+     "memberOf": ""
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to select any existing text in the field immediately on focus.  Only applies\nwhen editable = true (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "queryParam",
+     "type": "String",
+     "desc": "Name of the query as it will be passed on the querystring (defaults to 'query')",
+     "memberOf": ""
+    },
+    {
+     "name": "loadingText",
+     "type": "String",
+     "desc": "The text to display in the dropdown list while data is loading.  Only applies\nwhen mode = 'remote' (defaults to 'Loading...')",
+     "memberOf": ""
+    },
+    {
+     "name": "resizable",
+     "type": "Boolean",
+     "desc": "True to add a resize handle to the bottom of the dropdown list (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "handleHeight",
+     "type": "Number",
+     "desc": "The height in pixels of the dropdown list resize handle if resizable = true (defaults to 8)",
+     "memberOf": ""
+    },
+    {
+     "name": "editable",
+     "type": "Boolean",
+     "desc": "False to prevent the user from typing text directly into the field, just like a\ntraditional select (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "allQuery",
+     "type": "String",
+     "desc": "The text query to send to the server to return all records for the list with no filtering (defaults to '')",
+     "memberOf": ""
+    },
+    {
+     "name": "mode",
+     "type": "String",
+     "desc": "Set to 'local' if the ComboBox loads local data (defaults to 'remote' which loads from the server)",
+     "memberOf": ""
+    },
+    {
+     "name": "minListWidth",
+     "type": "Number",
+     "desc": "The minimum width of the dropdown list in pixels (defaults to 70, will be ignored if\nlistWidth has a higher value)",
+     "memberOf": ""
+    },
+    {
+     "name": "forceSelection",
+     "type": "Boolean",
+     "desc": "True to restrict the selected value to one of the values in the list, false to\nallow the user to set arbitrary text into the field (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "typeAheadDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds to wait until the typeahead text is displayed\nif typeAhead = true (defaults to 250)",
+     "memberOf": ""
+    },
+    {
+     "name": "valueNotFoundText",
+     "type": "String",
+     "desc": "When using a name/value combo, if the value passed to setValue is not found in\nthe store, valueNotFoundText will be displayed as the field text if defined (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "blockFocus",
+     "type": "Boolean",
+     "desc": "Prevents all focus calls, so it can work with things like HTML edtor bar",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClear",
+     "type": "Boolean",
+     "desc": "Disable showing of clear button.",
+     "memberOf": ""
+    },
+    {
+     "name": "alwaysQuery",
+     "type": "Boolean",
+     "desc": "Disable caching of results, and always send query",
+     "memberOf": ""
+    },
+    {
+     "name": "hideTrigger",
+     "type": "Boolean",
+     "desc": "True to hide the trigger element and display only the base text field (defaults to false)",
+     "memberOf": "Roo.form.TriggerField"
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "add",
+     "sig": "function (combo)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the 'add' icon is pressed (add a listener to enable add button)"
+    },
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforequery",
+     "sig": "function (combo, query, forceAll, cancel, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before all queries are processed. Return false to cancel the query or set cancel to true.\nThe event object passed has these properties:"
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeselect",
+     "sig": "function (combo, record, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a list item is selected. Return false to cancel the selection."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "collapse",
+     "sig": "function (combo)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the dropdown list is collapsed"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "edit",
+     "sig": "function (combo, record)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the 'edit' icon is pressed (add a listener to enable add button)"
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "expand",
+     "sig": "function (combo)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the dropdown list is expanded"
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "select",
+     "sig": "function (combo, record, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a list item is selected"
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.DateField": {
+   "props": [
+    {
+     "name": "format",
+     "type": "String",
+     "desc": "The default date format string which can be overriden for localization support.  The format must be\nvalid according to {@link Date#parseDate} (defaults to 'm/d/y').",
+     "memberOf": ""
+    },
+    {
+     "name": "altFormats",
+     "type": "String",
+     "desc": "Multiple date formats separated by \"|\" to try when parsing a user input value and it doesn't match the defined\nformat (defaults to 'm/d/Y|m-d-y|m-d-Y|m/d|m-d|d').",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDays",
+     "type": "Array",
+     "desc": "An array of days to disable, 0 based. For example, [0, 6] disables Sunday and Saturday (defaults to null).",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDaysText",
+     "type": "String",
+     "desc": "The tooltip to display when the date falls on a disabled day (defaults to 'Disabled')",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDates",
+     "type": "Array",
+     "desc": "An array of \"dates\" to disable, as strings. These strings will be used to build a dynamic regular\nexpression so they are very powerful. Some examples:\n<ul>\n<li>[\"03/08/2003\", \"09/16/2003\"] would disable those exact dates</li>\n<li>[\"03/08\", \"09/16\"] would disable those days for every year</li>\n<li>[\"^03/08\"] would only match the beginning (useful if you are using short years)</li>\n<li>[\"03/../2006\"] would disable every day in March 2006</li>\n<li>[\"^03\"] would disable every day in every March</li>\n</ul>\nIn order to support regular expressions, if you are using a date format that has \".\" in it, you will have to\nescape the dot when restricting dates. For example: [\"03\\\\.08\\\\.03\"].",
+     "memberOf": ""
+    },
+    {
+     "name": "disabledDatesText",
+     "type": "String",
+     "desc": "The tooltip text to display when the date falls on a disabled date (defaults to 'Disabled')",
+     "memberOf": ""
+    },
+    {
+     "name": "minValue",
+     "type": "Date/String",
+     "desc": "The minimum allowed date. Can be either a Javascript date object or a string date in a\nvalid format (defaults to null).",
+     "memberOf": ""
+    },
+    {
+     "name": "maxValue",
+     "type": "Date/String",
+     "desc": "The maximum allowed date. Can be either a Javascript date object or a string date in a\nvalid format (defaults to null).",
+     "memberOf": ""
+    },
+    {
+     "name": "minText",
+     "type": "String",
+     "desc": "The error text to display when the date in the cell is before minValue (defaults to\n'The date in this field must be after {minValue}').",
+     "memberOf": ""
+    },
+    {
+     "name": "maxText",
+     "type": "String",
+     "desc": "The error text to display when the date in the cell is after maxValue (defaults to\n'The date in this field must be before {maxValue}').",
+     "memberOf": ""
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to display when the date in the field is invalid (defaults to\n'{value} is not a valid date - it must be in the format {format}').",
+     "memberOf": ""
+    },
+    {
+     "name": "triggerClass",
+     "type": "String",
+     "desc": "An additional CSS class used to style the trigger button.  The trigger will always get the\nclass 'x-form-trigger' and triggerClass will be <b>appended</b> if specified (defaults to 'x-form-date-trigger'\nwhich displays a calendar icon).",
+     "memberOf": ""
+    },
+    {
+     "name": "useIso",
+     "type": "bool",
+     "desc": "if enabled, then the date field will use a hidden field to store the \nreal value as iso formated date. default (false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"text\", size: \"10\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "hideTrigger",
+     "type": "Boolean",
+     "desc": "True to hide the trigger element and display only the base text field (defaults to false)",
+     "memberOf": "Roo.form.TriggerField"
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "select",
+     "sig": "function (combo, date)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a date is selected"
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.DisplayField": {
+   "props": [
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the checkbox receives focus (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the checkbox (defaults to \"x-form-field\")",
+     "memberOf": ""
+    },
+    {
+     "name": "valueRenderer",
+     "type": "Function",
+     "desc": "The renderer for the field (so you can reformat output). should return raw HTML",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"checkbox\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.FCKeditor": {
+   "props": [
+    {
+     "name": "fck",
+     "type": "Object",
+     "desc": "options - see fck manual for details.",
+     "memberOf": ""
+    },
+    {
+     "name": "growMin",
+     "type": "Number",
+     "desc": "The minimum height to allow when grow = true (defaults to 60)",
+     "memberOf": "Roo.form.TextArea"
+    },
+    {
+     "name": "growMax",
+     "type": "Number",
+     "desc": "The maximum height to allow when grow = true (defaults to 1000)",
+     "memberOf": "Roo.form.TextArea"
+    },
+    {
+     "name": "preventScrollbars",
+     "type": "Boolean",
+     "desc": "True to prevent scrollbars from appearing regardless of how much text is\nin the field (equivalent to setting overflow: hidden, defaults to false)",
+     "memberOf": "Roo.form.TextArea"
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"textarea\", style: \"width:300px;height:60px;\", autocomplete: \"off\"})",
+     "memberOf": "Roo.form.TextArea"
+    },
+    {
+     "name": "grow",
+     "type": "Boolean",
+     "desc": "True if this field should automatically grow and shrink to its content",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "editorinit",
+     "sig": "function (_self, the)\n{\n\n}",
+     "type": "function",
+     "desc": "Fired when the editor is initialized - you can add extra handlers here.."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.Field": {
+   "props": [
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": ""
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": ""
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": ""
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": ""
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": ""
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": ""
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": ""
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": ""
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"text\", size: \"20\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": ""
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": ""
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": ""
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": ""
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": ""
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": ""
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": ""
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": ""
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": ""
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.FieldSet": {
+   "props": [
+    {
+     "name": "legend",
+     "type": "String",
+     "desc": "The text to display as the legend for the FieldSet (defaults to '')",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec used to autocreate the fieldset (defaults to {tag: 'fieldset', cn: {tag:'legend'}})",
+     "memberOf": ""
+    },
+    {
+     "name": "style",
+     "type": "String/Object/Function",
+     "desc": "A style specification string, e.g. \"width:100px\", or object in the form {width:\"100px\"}, or\na function which returns such a specification.",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"top\" and \"right\" (defaults to \"left\")",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelWidth",
+     "type": "Number",
+     "desc": "Fixed width in pixels of all field labels (defaults to undefined)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "clear",
+     "type": "Boolean",
+     "desc": "True to add a clearing element at the end of this layout, equivalent to CSS clear: both (defaults to true)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelSeparator",
+     "type": "String",
+     "desc": "The separator to use after field labels (defaults to ':')",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "hideLabels",
+     "type": "Boolean",
+     "desc": "True to suppress the display of field labels in this layout (defaults to false)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.form.Form": {
+   "props": [
+    {
+     "name": "labelWidth",
+     "type": "Number",
+     "desc": "The width of labels. This property cascades to child containers.",
+     "memberOf": ""
+    },
+    {
+     "name": "itemCls",
+     "type": "String",
+     "desc": "A css class to apply to the x-form-item of fields. This property cascades to child containers.",
+     "memberOf": ""
+    },
+    {
+     "name": "buttonAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"center\" and \"right\" (defaults to \"center\")",
+     "memberOf": ""
+    },
+    {
+     "name": "minButtonWidth",
+     "type": "Number",
+     "desc": "Minimum width of all buttons in pixels (defaults to 75)",
+     "memberOf": ""
+    },
+    {
+     "name": "labelAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"top\" and \"right\" (defaults to \"left\").\nThis property cascades to child containers if not set.",
+     "memberOf": ""
+    },
+    {
+     "name": "monitorValid",
+     "type": "Boolean",
+     "desc": "If true the form monitors its valid state <b>client-side</b> and\nfires a looping event with that state. This is required to bind buttons to the valid\nstate using the config value formBind:true on the button.",
+     "memberOf": ""
+    },
+    {
+     "name": "monitorPoll",
+     "type": "Number",
+     "desc": "The milliseconds to poll valid state, ignored if monitorValid is not true (defaults to 200)",
+     "memberOf": ""
+    },
+    {
+     "name": "progressUrl",
+     "type": "String",
+     "desc": "- Url to return progress data",
+     "memberOf": ""
+    },
+    {
+     "name": "method",
+     "type": "String",
+     "desc": "The request method to use (GET or POST) for form actions if one isn't supplied in the action options.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "reader",
+     "type": "DataReader",
+     "desc": "An Roo.data.DataReader (e.g. {@link Roo.data.XmlReader}) to be used to read data when executing \"load\" actions.\nThis is optional as there is built-in support for processing JSON.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "errorReader",
+     "type": "DataReader",
+     "desc": "An Roo.data.DataReader (e.g. {@link Roo.data.XmlReader}) to be used to read data when reading validation errors on \"submit\" actions.\nThis is completely optional as there is built-in support for processing JSON.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "url",
+     "type": "String",
+     "desc": "The URL to use for form actions if one isn't supplied in the action options.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "fileUpload",
+     "type": "Boolean",
+     "desc": "Set to true if this form is a file upload.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "baseParams",
+     "type": "Object",
+     "desc": "Parameters to pass with all requests. e.g. baseParams: {id: '123', foo: 'bar'}.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "timeout",
+     "type": "Number",
+     "desc": "Timeout for form actions in seconds (default is 30 seconds).",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "trackResetOnLoad",
+     "type": "Boolean",
+     "desc": "If set to true, form.reset() resets to the last loaded\nor setValues() data instead of when the form was first created.",
+     "memberOf": "Roo.form.BasicForm"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "actioncomplete",
+     "sig": "function (_self, action)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an action is completed."
+    },
+    {
+     "name": "actionfailed",
+     "sig": "function (_self, action)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an action fails."
+    },
+    {
+     "name": "beforeaction",
+     "sig": "function (_self, action)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before any action is performed. Return false to cancel the action."
+    },
+    {
+     "name": "clientvalidation",
+     "sig": "function (_self, valid)\n{\n\n}",
+     "type": "function",
+     "desc": "If the monitorValid config option is true, this event fires repetitively to notify of valid state"
+    },
+    {
+     "name": "rendered",
+     "sig": "function (form)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the form is rendered"
+    }
+   ]
+  },
+  "Roo.form.GridField": {
+   "props": [
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "- used to restrict width of grid..",
+     "memberOf": ""
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "- used to restrict height of grid..",
+     "memberOf": ""
+    },
+    {
+     "name": "xgrid",
+     "type": "Object",
+     "desc": "(xtype'd description of grid) { xtype : 'Grid', dataSource: .... }\n\n}",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"checkbox\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "addTitle",
+     "type": "String",
+     "desc": "Text to include for adding a title.",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.Hidden": {
+   "props": [
+    {
+     "name": "grow",
+     "type": "Boolean",
+     "desc": "True if this field should automatically grow and shrink to its content",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "growMin",
+     "type": "Number",
+     "desc": "The minimum width to allow when grow = true (defaults to 30)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "growMax",
+     "type": "Number",
+     "desc": "The maximum width to allow when grow = true (defaults to 800)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"text\", size: \"20\", autocomplete: \"off\"})",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.HtmlEditor": {
+   "props": [
+    {
+     "name": "toolbars",
+     "type": "Array",
+     "desc": "Array of toolbars. - defaults to just the Standard one",
+     "memberOf": ""
+    },
+    {
+     "name": "createLinkText",
+     "type": "String",
+     "desc": "The default text for the create link prompt",
+     "memberOf": ""
+    },
+    {
+     "name": "defaultLinkValue",
+     "type": "String",
+     "desc": "The default value for the create link prompt (defaults to http:/ /)",
+     "memberOf": ""
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the editor is first receives the focus. Any insertion must wait\nuntil after this event."
+    },
+    {
+     "name": "beforepush",
+     "sig": "function (_self, html)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the iframe editor is updated with content from the textarea. Return false\nto cancel the push."
+    },
+    {
+     "name": "beforesync",
+     "sig": "function (_self, html)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the textarea is updated with content from the editor iframe. Return false\nto cancel the sync."
+    },
+    {
+     "name": "editmodechange",
+     "sig": "function (_self, sourceEdit)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the editor switches edit modes"
+    },
+    {
+     "name": "editorevent",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when on any editor (mouse up/down cursor movement etc.) - used for toolbar hooks."
+    },
+    {
+     "name": "initialize",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the editor is fully initialized (including the iframe)"
+    },
+    {
+     "name": "push",
+     "sig": "function (_self, html)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the iframe editor is updated with content from the textarea."
+    },
+    {
+     "name": "sync",
+     "sig": "function (_self, html)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the textarea is updated with content from the editor iframe."
+    }
+   ]
+  },
+  "Roo.form.HtmlEditor.ToolbarContext": {
+   "props": [
+    {
+     "name": "disable",
+     "type": "Object",
+     "desc": "List of toolbar elements to disable",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.form.HtmlEditor.ToolbarStandard": {
+   "props": [
+    {
+     "name": "disable",
+     "type": "Object",
+     "desc": "List of elements to disable..",
+     "memberOf": ""
+    },
+    {
+     "name": "btns",
+     "type": "Array",
+     "desc": "List of additional buttons.\n\n\nNEEDS Extra CSS? \n.x-html-editor-tb .x-edit-none .x-btn-text { background: none; }",
+     "memberOf": ""
+    },
+    {
+     "name": "fontFamilies",
+     "type": "Array",
+     "desc": "An array of available font families",
+     "memberOf": ""
+    },
+    {
+     "name": "defaultFont",
+     "type": "String",
+     "desc": "default font to use.",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.form.Layout": {
+   "props": [
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec used to autocreate the layout (defaults to {tag: 'div', cls: 'x-form-ct'})",
+     "memberOf": ""
+    },
+    {
+     "name": "style",
+     "type": "String/Object/Function",
+     "desc": "A style specification string, e.g. \"width:100px\", or object in the form {width:\"100px\"}, or\na function which returns such a specification.",
+     "memberOf": ""
+    },
+    {
+     "name": "labelAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"top\" and \"right\" (defaults to \"left\")",
+     "memberOf": ""
+    },
+    {
+     "name": "labelWidth",
+     "type": "Number",
+     "desc": "Fixed width in pixels of all field labels (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "clear",
+     "type": "Boolean",
+     "desc": "True to add a clearing element at the end of this layout, equivalent to CSS clear: both (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "labelSeparator",
+     "type": "String",
+     "desc": "The separator to use after field labels (defaults to ':')",
+     "memberOf": ""
+    },
+    {
+     "name": "hideLabels",
+     "type": "Boolean",
+     "desc": "True to suppress the display of field labels in this layout (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.form.NumberField": {
+   "props": [
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field x-form-num-field\")",
+     "memberOf": ""
+    },
+    {
+     "name": "allowDecimals",
+     "type": "Boolean",
+     "desc": "False to disallow decimal values (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "decimalSeparator",
+     "type": "String",
+     "desc": "Character(s) to allow as the decimal separator (defaults to '.')",
+     "memberOf": ""
+    },
+    {
+     "name": "decimalPrecision",
+     "type": "Number",
+     "desc": "The maximum precision to display after the decimal separator (defaults to 2)",
+     "memberOf": ""
+    },
+    {
+     "name": "allowNegative",
+     "type": "Boolean",
+     "desc": "False to prevent entering a negative sign (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "minValue",
+     "type": "Number",
+     "desc": "The minimum allowed value (defaults to Number.NEGATIVE_INFINITY)",
+     "memberOf": ""
+    },
+    {
+     "name": "maxValue",
+     "type": "Number",
+     "desc": "The maximum allowed value (defaults to Number.MAX_VALUE)",
+     "memberOf": ""
+    },
+    {
+     "name": "minText",
+     "type": "String",
+     "desc": "Error text to display if the minimum value validation fails (defaults to \"The minimum value for this field is {minValue}\")",
+     "memberOf": ""
+    },
+    {
+     "name": "maxText",
+     "type": "String",
+     "desc": "Error text to display if the maximum value validation fails (defaults to \"The maximum value for this field is {maxValue}\")",
+     "memberOf": ""
+    },
+    {
+     "name": "nanText",
+     "type": "String",
+     "desc": "Error text to display if the value is not a valid number.  For example, this can happen\nif a valid character like '.' or '-' is left in the field with no number (defaults to \"{value} is not a valid number\")",
+     "memberOf": ""
+    },
+    {
+     "name": "grow",
+     "type": "Boolean",
+     "desc": "True if this field should automatically grow and shrink to its content",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "growMin",
+     "type": "Number",
+     "desc": "The minimum width to allow when grow = true (defaults to 30)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "growMax",
+     "type": "Number",
+     "desc": "The maximum width to allow when grow = true (defaults to 800)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"text\", size: \"20\", autocomplete: \"off\"})",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.Radio": {
+   "props": [
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the checkbox receives focus (defaults to undefined)",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the checkbox (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "checked",
+     "type": "Boolean",
+     "desc": "True if the the checkbox should render already checked (defaults to false)",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"checkbox\", autocomplete: \"off\"})",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "boxLabel",
+     "type": "String",
+     "desc": "The text that appears beside the checkbox",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "inputValue",
+     "type": "String",
+     "desc": "The value that should go into the generated input element's value attribute",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "valueOff",
+     "type": "String",
+     "desc": "The value that should go into the generated input element's value when unchecked.",
+     "memberOf": "Roo.form.Checkbox"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "check",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the checkbox is checked or unchecked."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.Row": {
+   "props": [
+    {
+     "name": "width",
+     "type": "Number/String",
+     "desc": "The fixed width of the column in pixels or CSS value (defaults to \"auto\")",
+     "memberOf": ""
+    },
+    {
+     "name": "height",
+     "type": "Number/String",
+     "desc": "The fixed height of the column in pixels or CSS value (defaults to \"auto\")",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec used to autocreate the layout (defaults to {tag: 'div', cls: 'x-form-ct'})",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "style",
+     "type": "String/Object/Function",
+     "desc": "A style specification string, e.g. \"width:100px\", or object in the form {width:\"100px\"}, or\na function which returns such a specification.",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelAlign",
+     "type": "String",
+     "desc": "Valid values are \"left,\" \"top\" and \"right\" (defaults to \"left\")",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelWidth",
+     "type": "Number",
+     "desc": "Fixed width in pixels of all field labels (defaults to undefined)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "clear",
+     "type": "Boolean",
+     "desc": "True to add a clearing element at the end of this layout, equivalent to CSS clear: both (defaults to true)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "labelSeparator",
+     "type": "String",
+     "desc": "The separator to use after field labels (defaults to ':')",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "hideLabels",
+     "type": "Boolean",
+     "desc": "True to suppress the display of field labels in this layout (defaults to false)",
+     "memberOf": "Roo.form.Layout"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.form.TextArea": {
+   "props": [
+    {
+     "name": "growMin",
+     "type": "Number",
+     "desc": "The minimum height to allow when grow = true (defaults to 60)",
+     "memberOf": ""
+    },
+    {
+     "name": "growMax",
+     "type": "Number",
+     "desc": "The maximum height to allow when grow = true (defaults to 1000)",
+     "memberOf": ""
+    },
+    {
+     "name": "preventScrollbars",
+     "type": "Boolean",
+     "desc": "True to prevent scrollbars from appearing regardless of how much text is\nin the field (equivalent to setting overflow: hidden, defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"textarea\", style: \"width:300px;height:60px;\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "grow",
+     "type": "Boolean",
+     "desc": "True if this field should automatically grow and shrink to its content",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.TextField": {
+   "props": [
+    {
+     "name": "grow",
+     "type": "Boolean",
+     "desc": "True if this field should automatically grow and shrink to its content",
+     "memberOf": ""
+    },
+    {
+     "name": "growMin",
+     "type": "Number",
+     "desc": "The minimum width to allow when grow = true (defaults to 30)",
+     "memberOf": ""
+    },
+    {
+     "name": "growMax",
+     "type": "Number",
+     "desc": "The maximum width to allow when grow = true (defaults to 800)",
+     "memberOf": ""
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": ""
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": ""
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": ""
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": ""
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": ""
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": ""
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": ""
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": ""
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": ""
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": ""
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"text\", size: \"20\", autocomplete: \"off\"})",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.TriggerField": {
+   "props": [
+    {
+     "name": "triggerClass",
+     "type": "String",
+     "desc": "An additional CSS class used to style the trigger button.  The trigger will always get the\nclass 'x-form-trigger' by default and triggerClass will be <b>appended</b> if specified.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoCreate",
+     "type": "String/Object",
+     "desc": "A DomHelper element spec, or true for a default element spec (defaults to\n{tag: \"input\", type: \"text\", size: \"16\", autocomplete: \"off\"})",
+     "memberOf": ""
+    },
+    {
+     "name": "hideTrigger",
+     "type": "Boolean",
+     "desc": "True to hide the trigger element and display only the base text field (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "vtype",
+     "type": "String",
+     "desc": "A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maskRe",
+     "type": "String",
+     "desc": "An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "disableKeyFilter",
+     "type": "Boolean",
+     "desc": "True to disable input keystroke filtering (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "allowBlank",
+     "type": "Boolean",
+     "desc": "False to validate that the value length > 0 (defaults to true)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLength",
+     "type": "Number",
+     "desc": "Minimum input field length required (defaults to 0)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLength",
+     "type": "Number",
+     "desc": "Maximum input field length allowed (defaults to Number.MAX_VALUE)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "minLengthText",
+     "type": "String",
+     "desc": "Error text to display if the minimum length validation fails (defaults to \"The minimum length for this field is {minLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "maxLengthText",
+     "type": "String",
+     "desc": "Error text to display if the maximum length validation fails (defaults to \"The maximum length for this field is {maxLength}\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "selectOnFocus",
+     "type": "Boolean",
+     "desc": "True to automatically select any existing field text when the field receives input focus (defaults to false)",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "blankText",
+     "type": "String",
+     "desc": "Error text to display if the allow blank validation fails (defaults to \"This field is required\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "validator",
+     "type": "Function",
+     "desc": "A custom validation function to be called during field validation (defaults to null).\nIf available, this function will be called only after the basic validators all return true, and will be passed the\ncurrent field value and expected to return boolean true if the value is valid or a string error message if invalid.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regex",
+     "type": "RegExp",
+     "desc": "A JavaScript RegExp object to be tested against the field value during validation (defaults to null).\nIf available, this regex will be evaluated only after the basic validators all return true, and will be passed the\ncurrent field value.  If the test fails, the field will be marked invalid using {@link #regexText}.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "regexText",
+     "type": "String",
+     "desc": "The error text to display if {@link #regex} is used and the test fails during validation (defaults to \"\")",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyText",
+     "type": "String",
+     "desc": "The default text to display in an empty field (defaults to null).",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "emptyClass",
+     "type": "String",
+     "desc": "The CSS class to apply to an empty field to style the {@link #emptyText} (defaults to\n'x-form-empty-field').  This class is automatically added and removed as needed depending on the current field value.",
+     "memberOf": "Roo.form.TextField"
+    },
+    {
+     "name": "fieldLabel",
+     "type": "String",
+     "desc": "Label to use when rendering a form.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "Mouse over tip",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "name",
+     "type": "String",
+     "desc": "The field's HTML name attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidClass",
+     "type": "String",
+     "desc": "The CSS class to use when marking a field invalid (defaults to \"x-form-invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "invalidText",
+     "type": "String",
+     "desc": "The error text to use when marking a field invalid and no message is provided (defaults to \"The value in this field is invalid\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "focusClass",
+     "type": "String",
+     "desc": "The CSS class to use when the field receives focus (defaults to \"x-form-focus\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationEvent",
+     "type": "String/Boolean",
+     "desc": "The event that should initiate field validation. Set to false to disable\n      automatic validation (defaults to \"keyup\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validateOnBlur",
+     "type": "Boolean",
+     "desc": "Whether the field should validate when it loses focus (defaults to true).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "validationDelay",
+     "type": "Number",
+     "desc": "The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "fieldClass",
+     "type": "String",
+     "desc": "The default CSS class for the field (defaults to \"x-form-field\")",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgTarget",
+     "type": "String",
+     "desc": "The location where error text should display.  Should be one of the following values (defaults to 'qtip'):\n<pre>\nValue         Description\n-----------   ----------------------------------------------------------------------\nqtip          Display a quick tip when the user hovers over the field\ntitle         Display a default browser title attribute popup\nunder         Add a block div beneath the field containing the error text\nside          Add an error icon to the right of the field with a popup on hover\n[element id]  Add the error text directly to the innerHTML of the specified element\n</pre>",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "msgFx",
+     "type": "String",
+     "desc": "<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "readOnly",
+     "type": "Boolean",
+     "desc": "True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "True to disable the field (defaults to false).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "inputType",
+     "type": "String",
+     "desc": "The type attribute for input fields -- e.g. radio, text, password (defaults to \"text\").",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "tabIndex",
+     "type": "Number",
+     "desc": "The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "A value to initialize this field with.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A CSS class to apply to the field's underlying element.",
+     "memberOf": "Roo.form.Field"
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "width (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "height",
+     "type": "Number",
+     "desc": "height (optional) size of component",
+     "memberOf": "Roo.BoxComponent"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "autosize",
+     "sig": "function (_self, width)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the autosize function is triggered.  The field may or may not have actually changed size\naccording to the default logic, but this event provides a hook for the developer to apply additional\nlogic at runtime to resize the field if needed."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "blur",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field loses input focus."
+    },
+    {
+     "name": "change",
+     "sig": "function (_self, newValue, oldValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires just before the field blurs if the field value has changed."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "focus",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this field receives input focus."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "invalid",
+     "sig": "function (_self, msg)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been marked as invalid."
+    },
+    {
+     "name": "keyup",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the key up"
+    },
+    {
+     "name": "move",
+     "sig": "function (_self, x, y)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is moved."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "resize",
+     "sig": "function (_self, adjWidth, adjHeight, rawWidth, rawHeight)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is resized."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "valid",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the field has been validated with no errors."
+    }
+   ]
+  },
+  "Roo.form.VTypes": {
+   "props": [],
+   "events": []
+  },
+  "Roo.grid": {
+   "props": [],
+   "events": []
+  },
+  "Roo.grid.AbstractGridView": {
+   "props": [],
+   "events": []
+  },
+  "Roo.grid.AbstractSelectionModel": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": []
+  },
+  "Roo.grid.CellSelectionModel": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforerowselect",
+     "sig": "function (_self, rowIndex, colIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a cell is selected."
+    },
+    {
+     "name": "cellselect",
+     "sig": "function (_self, rowIndex, colIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is selected."
+    },
+    {
+     "name": "selectionchange",
+     "sig": "function (_self, selection)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the active selection changes."
+    }
+   ]
+  },
+  "Roo.grid.ColumnModel": {
+   "props": [
+    {
+     "name": "header",
+     "type": "String",
+     "desc": "The header text to display in the Grid view.",
+     "memberOf": ""
+    },
+    {
+     "name": "dataIndex",
+     "type": "String",
+     "desc": "(Optional) The name of the field in the grid's {@link Roo.data.Store}'s\n{@link Roo.data.Record} definition from which to draw the column's value. If not\nspecified, the column's index is used as an index into the Record's data Array.",
+     "memberOf": ""
+    },
+    {
+     "name": "width",
+     "type": "Number",
+     "desc": "(Optional) The initial width in pixels of the column. Using this\ninstead of {@link Roo.grid.Grid#autoSizeColumns} is more efficient.",
+     "memberOf": ""
+    },
+    {
+     "name": "sortable",
+     "type": "Boolean",
+     "desc": "(Optional) True if sorting is to be allowed on this column.\nDefaults to the value of the {@link #defaultSortable} property.\nWhether local/remote sorting is used is specified in {@link Roo.data.Store#remoteSort}.",
+     "memberOf": ""
+    },
+    {
+     "name": "locked",
+     "type": "Boolean",
+     "desc": "(Optional) True to lock the column in place while scrolling the Grid.  Defaults to false.",
+     "memberOf": ""
+    },
+    {
+     "name": "fixed",
+     "type": "Boolean",
+     "desc": "(Optional) True if the column width cannot be changed.  Defaults to false.",
+     "memberOf": ""
+    },
+    {
+     "name": "resizable",
+     "type": "Boolean",
+     "desc": "(Optional) False to disable column resizing. Defaults to true.",
+     "memberOf": ""
+    },
+    {
+     "name": "hidden",
+     "type": "Boolean",
+     "desc": "(Optional) True to hide the column. Defaults to false.",
+     "memberOf": ""
+    },
+    {
+     "name": "renderer",
+     "type": "Function",
+     "desc": "(Optional) A function used to generate HTML markup for a cell\ngiven the cell's data value. See {@link #setRenderer}. If not specified, the\ndefault renderer uses the raw data value.",
+     "memberOf": ""
+    },
+    {
+     "name": "editor",
+     "type": "Roo.grid.GridEditor",
+     "desc": "(Optional) For grid editors - returns the grid editor",
+     "memberOf": ""
+    },
+    {
+     "name": "align",
+     "type": "String",
+     "desc": "(Optional) Set the CSS text-align property of the column.  Defaults to undefined.",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "columlockchange",
+     "sig": "function (_self, colIndex, locked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a column's locked state is changed"
+    },
+    {
+     "name": "columnmoved",
+     "sig": "function (_self, oldIndex, newIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a column is moved."
+    },
+    {
+     "name": "headerchange",
+     "sig": "function (_self, columnIndex, newText)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the text of a header changes."
+    },
+    {
+     "name": "hiddenchange",
+     "sig": "function (_self, columnIndex, hidden)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a column is hidden or \"unhidden\"."
+    },
+    {
+     "name": "widthchange",
+     "sig": "function (_self, columnIndex, newWidth)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the width of a column changes."
+    }
+   ]
+  },
+  "Roo.grid.EditorGrid": {
+   "props": [
+    {
+     "name": "clicksToEdit",
+     "type": "Number",
+     "desc": "The number of clicks on a cell required to display the cell's editor (defaults to 2)",
+     "memberOf": ""
+    },
+    {
+     "name": "ddGroup",
+     "type": "String",
+     "desc": "- drag drop group.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableDrag",
+     "type": "Boolean",
+     "desc": "True to enable drag of rows. Default is false. (double check if this is needed?)",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoWidth",
+     "type": "Boolean",
+     "desc": "True to set the grid's width to the default total width of the grid's columns instead\nof a fixed width. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "maxHeight",
+     "type": "Number",
+     "desc": "Sets the maximum height of the grid - ignored if autoHeight is not on.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "minColumnWidth",
+     "type": "Number",
+     "desc": "The minimum width a column can be resized to. Default is 25.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoSizeColumns",
+     "type": "Boolean",
+     "desc": "True to automatically resize the columns to fit their content\n<b>on initial render.</b> It is more efficient to explicitly size the columns\nthrough the ColumnModel's {@link Roo.grid.ColumnModel#width} config option.  Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoSizeHeaders",
+     "type": "Boolean",
+     "desc": "True to measure headers with column data when auto sizing columns. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "monitorWindowResize",
+     "type": "Boolean",
+     "desc": "True to autoSize the grid when the window resizes. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "maxRowsToMeasure",
+     "type": "Boolean",
+     "desc": "If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of\nrows measured to get a columns size. Default is 0 (all rows).",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "trackMouseOver",
+     "type": "Boolean",
+     "desc": "True to highlight rows when the mouse is over. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableDragDrop",
+     "type": "Boolean",
+     "desc": "True to enable drag and drop of rows. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableColumnMove",
+     "type": "Boolean",
+     "desc": "True to enable drag and drop reorder of columns. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableColumnHide",
+     "type": "Boolean",
+     "desc": "True to enable hiding of columns with the header context menu. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableRowHeightSync",
+     "type": "Boolean",
+     "desc": "True to manually sync row heights across locked and not locked rows. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "stripeRows",
+     "type": "Boolean",
+     "desc": "True to stripe the rows.  Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoHeight",
+     "type": "Boolean",
+     "desc": "True to fit the height of the grid container to the height of the data. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoExpandColumn",
+     "type": "String",
+     "desc": "The id (or dataIndex) of a column in this grid that should expand to fill unused space. This id can not be 0. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoExpandMin",
+     "type": "Number",
+     "desc": "The minimum width the autoExpandColumn can have (if enabled).\nDefault is 50.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoExpandMax",
+     "type": "Number",
+     "desc": "The maximum width the autoExpandColumn can have (if enabled). Default is 1000.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "view",
+     "type": "Object",
+     "desc": "The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render().",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "loadMask",
+     "type": "Object",
+     "desc": "An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "afteredit",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a cell is edited. <br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>grid - This grid</li>\n<li>record - The record being edited</li>\n<li>field - The field name being edited</li>\n<li>value - The value being set</li>\n<li>originalValue - The original value for the field, before the edit.</li>\n<li>row - The grid row index</li>\n<li>column - The grid column index</li>\n</ul>"
+    },
+    {
+     "name": "beforeedit",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before cell editing is triggered. The edit event object has the following properties <br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>grid - This grid</li>\n<li>record - The record being edited</li>\n<li>field - The field name being edited</li>\n<li>value - The value for the field being edited.</li>\n<li>row - The grid row index</li>\n<li>column - The grid column index</li>\n<li>cancel - Set this to true to cancel the edit or return false from your handler.</li>\n</ul>"
+    },
+    {
+     "name": "bodyscroll",
+     "sig": "function (scrollLeft, scrollTop)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the body element is scrolled"
+    },
+    {
+     "name": "cellclick",
+     "sig": "function (_self, rowIndex, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is clicked"
+    },
+    {
+     "name": "cellcontextmenu",
+     "sig": "function (_self, rowIndex, cellIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is right clicked"
+    },
+    {
+     "name": "celldblclick",
+     "sig": "function (_self, rowIndex, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is double clicked"
+    },
+    {
+     "name": "click",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw click event for the entire grid."
+    },
+    {
+     "name": "columnmove",
+     "sig": "function (oldIndex, newIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user moves a column"
+    },
+    {
+     "name": "columnresize",
+     "sig": "function (columnIndex, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes a column"
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw contextmenu event for the entire grid."
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw dblclick event for the entire grid."
+    },
+    {
+     "name": "dragdrop",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when dragged row(s) are dropped on a valid DD target"
+    },
+    {
+     "name": "dragenter\n Fires when the dragged row(s) first cross another DD target while being dragged",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": ""
+    },
+    {
+     "name": "dragout",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the dragged row(s) leave another DD target while being dragged"
+    },
+    {
+     "name": "dragover",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires while row(s) are being dragged. \"targetId\" is the id of the Yahoo.util.DD object the selected rows are being dragged over."
+    },
+    {
+     "name": "enddrag",
+     "sig": "function (_self, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a drag operation is complete"
+    },
+    {
+     "name": "headerclick",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header is clicked"
+    },
+    {
+     "name": "headercontextmenu",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header is right clicked"
+    },
+    {
+     "name": "headerdblclick",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header cell is double clicked"
+    },
+    {
+     "name": "keydown",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw keydown event for the entire grid."
+    },
+    {
+     "name": "keypress",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw keypress event for the entire grid."
+    },
+    {
+     "name": "mousedown",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mousedown event for the entire grid."
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseout event for the entire grid."
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseover event for the entire grid."
+    },
+    {
+     "name": "mouseup",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseup event for the entire grid."
+    },
+    {
+     "name": "render",
+     "sig": "function (grid)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the grid is rendered"
+    },
+    {
+     "name": "rowclick",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is clicked"
+    },
+    {
+     "name": "rowcontextmenu",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is right clicked"
+    },
+    {
+     "name": "rowdblclick",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is double clicked"
+    },
+    {
+     "name": "startdrag",
+     "sig": "function (_self, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when row(s) start being dragged"
+    },
+    {
+     "name": "validateedit",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a cell is edited, but before the value is set in the record. \nYou can use this to modify the value being set in the field, Return false\nto cancel the change. The edit event object has the following properties <br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>editor - This editor</li>\n<li>grid - This grid</li>\n<li>record - The record being edited</li>\n<li>field - The field name being edited</li>\n<li>value - The value being set</li>\n<li>originalValue - The original value for the field, before the edit.</li>\n<li>row - The grid row index</li>\n<li>column - The grid column index</li>\n<li>cancel - Set this to true to cancel the edit or return false from your handler.</li>\n</ul>"
+    }
+   ]
+  },
+  "Roo.grid.Grid": {
+   "props": [
+    {
+     "name": "ddGroup",
+     "type": "String",
+     "desc": "- drag drop group.",
+     "memberOf": ""
+    },
+    {
+     "name": "enableDrag",
+     "type": "Boolean",
+     "desc": "True to enable drag of rows. Default is false. (double check if this is needed?)",
+     "memberOf": ""
+    },
+    {
+     "name": "autoWidth",
+     "type": "Boolean",
+     "desc": "True to set the grid's width to the default total width of the grid's columns instead\nof a fixed width. Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "maxHeight",
+     "type": "Number",
+     "desc": "Sets the maximum height of the grid - ignored if autoHeight is not on.",
+     "memberOf": ""
+    },
+    {
+     "name": "minColumnWidth",
+     "type": "Number",
+     "desc": "The minimum width a column can be resized to. Default is 25.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoSizeColumns",
+     "type": "Boolean",
+     "desc": "True to automatically resize the columns to fit their content\n<b>on initial render.</b> It is more efficient to explicitly size the columns\nthrough the ColumnModel's {@link Roo.grid.ColumnModel#width} config option.  Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoSizeHeaders",
+     "type": "Boolean",
+     "desc": "True to measure headers with column data when auto sizing columns. Default is true.",
+     "memberOf": ""
+    },
+    {
+     "name": "monitorWindowResize",
+     "type": "Boolean",
+     "desc": "True to autoSize the grid when the window resizes. Default is true.",
+     "memberOf": ""
+    },
+    {
+     "name": "maxRowsToMeasure",
+     "type": "Boolean",
+     "desc": "If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of\nrows measured to get a columns size. Default is 0 (all rows).",
+     "memberOf": ""
+    },
+    {
+     "name": "trackMouseOver",
+     "type": "Boolean",
+     "desc": "True to highlight rows when the mouse is over. Default is true.",
+     "memberOf": ""
+    },
+    {
+     "name": "enableDragDrop",
+     "type": "Boolean",
+     "desc": "True to enable drag and drop of rows. Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "enableColumnMove",
+     "type": "Boolean",
+     "desc": "True to enable drag and drop reorder of columns. Default is true.",
+     "memberOf": ""
+    },
+    {
+     "name": "enableColumnHide",
+     "type": "Boolean",
+     "desc": "True to enable hiding of columns with the header context menu. Default is true.",
+     "memberOf": ""
+    },
+    {
+     "name": "enableRowHeightSync",
+     "type": "Boolean",
+     "desc": "True to manually sync row heights across locked and not locked rows. Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "stripeRows",
+     "type": "Boolean",
+     "desc": "True to stripe the rows.  Default is true.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoHeight",
+     "type": "Boolean",
+     "desc": "True to fit the height of the grid container to the height of the data. Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoExpandColumn",
+     "type": "String",
+     "desc": "The id (or dataIndex) of a column in this grid that should expand to fill unused space. This id can not be 0. Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoExpandMin",
+     "type": "Number",
+     "desc": "The minimum width the autoExpandColumn can have (if enabled).\nDefault is 50.",
+     "memberOf": ""
+    },
+    {
+     "name": "autoExpandMax",
+     "type": "Number",
+     "desc": "The maximum width the autoExpandColumn can have (if enabled). Default is 1000.",
+     "memberOf": ""
+    },
+    {
+     "name": "view",
+     "type": "Object",
+     "desc": "The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render().",
+     "memberOf": ""
+    },
+    {
+     "name": "loadMask",
+     "type": "Object",
+     "desc": "An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false.",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "bodyscroll",
+     "sig": "function (scrollLeft, scrollTop)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the body element is scrolled"
+    },
+    {
+     "name": "cellclick",
+     "sig": "function (_self, rowIndex, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is clicked"
+    },
+    {
+     "name": "cellcontextmenu",
+     "sig": "function (_self, rowIndex, cellIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is right clicked"
+    },
+    {
+     "name": "celldblclick",
+     "sig": "function (_self, rowIndex, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is double clicked"
+    },
+    {
+     "name": "click",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw click event for the entire grid."
+    },
+    {
+     "name": "columnmove",
+     "sig": "function (oldIndex, newIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user moves a column"
+    },
+    {
+     "name": "columnresize",
+     "sig": "function (columnIndex, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes a column"
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw contextmenu event for the entire grid."
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw dblclick event for the entire grid."
+    },
+    {
+     "name": "dragdrop",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when dragged row(s) are dropped on a valid DD target"
+    },
+    {
+     "name": "dragenter\n Fires when the dragged row(s) first cross another DD target while being dragged",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": ""
+    },
+    {
+     "name": "dragout",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the dragged row(s) leave another DD target while being dragged"
+    },
+    {
+     "name": "dragover",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires while row(s) are being dragged. \"targetId\" is the id of the Yahoo.util.DD object the selected rows are being dragged over."
+    },
+    {
+     "name": "enddrag",
+     "sig": "function (_self, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a drag operation is complete"
+    },
+    {
+     "name": "headerclick",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header is clicked"
+    },
+    {
+     "name": "headercontextmenu",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header is right clicked"
+    },
+    {
+     "name": "headerdblclick",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header cell is double clicked"
+    },
+    {
+     "name": "keydown",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw keydown event for the entire grid."
+    },
+    {
+     "name": "keypress",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw keypress event for the entire grid."
+    },
+    {
+     "name": "mousedown",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mousedown event for the entire grid."
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseout event for the entire grid."
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseover event for the entire grid."
+    },
+    {
+     "name": "mouseup",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseup event for the entire grid."
+    },
+    {
+     "name": "render",
+     "sig": "function (grid)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the grid is rendered"
+    },
+    {
+     "name": "rowclick",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is clicked"
+    },
+    {
+     "name": "rowcontextmenu",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is right clicked"
+    },
+    {
+     "name": "rowdblclick",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is double clicked"
+    },
+    {
+     "name": "startdrag",
+     "sig": "function (_self, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when row(s) start being dragged"
+    }
+   ]
+  },
+  "Roo.grid.GridEditor": {
+   "props": [
+    {
+     "name": "field",
+     "type": "Roo.form.Field",
+     "desc": "Field to wrap (or xtyped)",
+     "memberOf": ""
+    },
+    {
+     "name": "autosize",
+     "type": "Boolean/String",
+     "desc": "True for the editor to automatically adopt the size of the underlying field, \"width\" to adopt the width only,\nor \"height\" to adopt the height only (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "revertInvalid",
+     "type": "Boolean",
+     "desc": "True to automatically revert the field value and cancel the edit when the user completes an edit and the field\nvalidation fails (defaults to true)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "ignoreNoChange",
+     "type": "Boolean",
+     "desc": "True to skip the the edit completion process (no save, no events fired) if the user completes an edit and\nthe value has not changed (defaults to false).  Applies only to string values - edits for other data types\nwill never be ignored.",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "hideEl",
+     "type": "Boolean",
+     "desc": "False to keep the bound element visible while the editor is displayed (defaults to true)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "The data value of the underlying field (defaults to \"\")",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "alignment",
+     "type": "String",
+     "desc": "The position to align to (see {@link Roo.Element#alignTo} for more details, defaults to \"c-c?\").",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "\"sides\" for sides/bottom only, \"frame\" for 4-way shadow, and \"drop\"\nfor bottom-right shadow (defaults to \"frame\")",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "constrain",
+     "type": "Boolean",
+     "desc": "True to constrain the editor to the viewport",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "completeOnEnter",
+     "type": "Boolean",
+     "desc": "True to complete the edit when the enter key is pressed (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "cancelOnEsc",
+     "type": "Boolean",
+     "desc": "True to cancel the edit when the escape key is pressed (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "updateEl",
+     "type": "Boolean",
+     "desc": "True to update the innerHTML of the bound element when the update completes (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforecomplete",
+     "sig": "function (_self, value, startValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a change has been made to the field, but before the change is reflected in the underlying\nfield.  Saving the change to the field can be canceled by returning false from the handler of this event.\nNote that if the value has not changed and ignoreNoChange = true, the editing will still end but this\nevent will not fire since no edit actually occurred."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "beforestartedit",
+     "sig": "function (_self, boundEl, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when editing is initiated, but before the value changes.  Editing can be canceled by returning\nfalse from the handler of this event."
+    },
+    {
+     "name": "complete",
+     "sig": "function (_self, value, startValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after editing is complete and any changed value has been written to the underlying field."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "startedit",
+     "sig": "function (boundEl, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this editor is displayed"
+    }
+   ]
+  },
+  "Roo.grid.GridView": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": []
+  },
+  "Roo.grid.PropertyGrid": {
+   "props": [
+    {
+     "name": "customEditors",
+     "type": "Object",
+     "desc": "map of colnames=> custom editors.\nthe custom editor can be one of the standard ones (date|string|number|int|boolean), or a\ngrid editor eg. Roo.grid.GridEditor(new Roo.form.TextArea({selectOnFocus:true})),\nfalse disables editing of the field.",
+     "memberOf": ""
+    },
+    {
+     "name": "propertyNames",
+     "type": "Object",
+     "desc": "map of property Names to their displayed value",
+     "memberOf": ""
+    },
+    {
+     "name": "clicksToEdit",
+     "type": "Number",
+     "desc": "The number of clicks on a cell required to display the cell's editor (defaults to 2)",
+     "memberOf": "Roo.grid.EditorGrid"
+    },
+    {
+     "name": "ddGroup",
+     "type": "String",
+     "desc": "- drag drop group.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableDrag",
+     "type": "Boolean",
+     "desc": "True to enable drag of rows. Default is false. (double check if this is needed?)",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoWidth",
+     "type": "Boolean",
+     "desc": "True to set the grid's width to the default total width of the grid's columns instead\nof a fixed width. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "maxHeight",
+     "type": "Number",
+     "desc": "Sets the maximum height of the grid - ignored if autoHeight is not on.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "minColumnWidth",
+     "type": "Number",
+     "desc": "The minimum width a column can be resized to. Default is 25.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoSizeColumns",
+     "type": "Boolean",
+     "desc": "True to automatically resize the columns to fit their content\n<b>on initial render.</b> It is more efficient to explicitly size the columns\nthrough the ColumnModel's {@link Roo.grid.ColumnModel#width} config option.  Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoSizeHeaders",
+     "type": "Boolean",
+     "desc": "True to measure headers with column data when auto sizing columns. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "monitorWindowResize",
+     "type": "Boolean",
+     "desc": "True to autoSize the grid when the window resizes. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "maxRowsToMeasure",
+     "type": "Boolean",
+     "desc": "If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of\nrows measured to get a columns size. Default is 0 (all rows).",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "trackMouseOver",
+     "type": "Boolean",
+     "desc": "True to highlight rows when the mouse is over. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableDragDrop",
+     "type": "Boolean",
+     "desc": "True to enable drag and drop of rows. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableColumnMove",
+     "type": "Boolean",
+     "desc": "True to enable drag and drop reorder of columns. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableColumnHide",
+     "type": "Boolean",
+     "desc": "True to enable hiding of columns with the header context menu. Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "enableRowHeightSync",
+     "type": "Boolean",
+     "desc": "True to manually sync row heights across locked and not locked rows. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "stripeRows",
+     "type": "Boolean",
+     "desc": "True to stripe the rows.  Default is true.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoHeight",
+     "type": "Boolean",
+     "desc": "True to fit the height of the grid container to the height of the data. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoExpandColumn",
+     "type": "String",
+     "desc": "The id (or dataIndex) of a column in this grid that should expand to fill unused space. This id can not be 0. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoExpandMin",
+     "type": "Number",
+     "desc": "The minimum width the autoExpandColumn can have (if enabled).\nDefault is 50.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "autoExpandMax",
+     "type": "Number",
+     "desc": "The maximum width the autoExpandColumn can have (if enabled). Default is 1000.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "view",
+     "type": "Object",
+     "desc": "The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render().",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "loadMask",
+     "type": "Object",
+     "desc": "An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false.",
+     "memberOf": "Roo.grid.Grid"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "afteredit",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a cell is edited. <br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>grid - This grid</li>\n<li>record - The record being edited</li>\n<li>field - The field name being edited</li>\n<li>value - The value being set</li>\n<li>originalValue - The original value for the field, before the edit.</li>\n<li>row - The grid row index</li>\n<li>column - The grid column index</li>\n</ul>"
+    },
+    {
+     "name": "beforeedit",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before cell editing is triggered. The edit event object has the following properties <br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>grid - This grid</li>\n<li>record - The record being edited</li>\n<li>field - The field name being edited</li>\n<li>value - The value for the field being edited.</li>\n<li>row - The grid row index</li>\n<li>column - The grid column index</li>\n<li>cancel - Set this to true to cancel the edit or return false from your handler.</li>\n</ul>"
+    },
+    {
+     "name": "beforepropertychange",
+     "sig": "function (grid, id, newval, oldval)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a property changes (return false to stop?)"
+    },
+    {
+     "name": "bodyscroll",
+     "sig": "function (scrollLeft, scrollTop)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the body element is scrolled"
+    },
+    {
+     "name": "cellclick",
+     "sig": "function (_self, rowIndex, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is clicked"
+    },
+    {
+     "name": "cellcontextmenu",
+     "sig": "function (_self, rowIndex, cellIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is right clicked"
+    },
+    {
+     "name": "celldblclick",
+     "sig": "function (_self, rowIndex, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a cell is double clicked"
+    },
+    {
+     "name": "click",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw click event for the entire grid."
+    },
+    {
+     "name": "columnmove",
+     "sig": "function (oldIndex, newIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user moves a column"
+    },
+    {
+     "name": "columnresize",
+     "sig": "function (columnIndex, newSize)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the user resizes a column"
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw contextmenu event for the entire grid."
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw dblclick event for the entire grid."
+    },
+    {
+     "name": "dragdrop",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when dragged row(s) are dropped on a valid DD target"
+    },
+    {
+     "name": "dragenter\n Fires when the dragged row(s) first cross another DD target while being dragged",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": ""
+    },
+    {
+     "name": "dragout",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the dragged row(s) leave another DD target while being dragged"
+    },
+    {
+     "name": "dragover",
+     "sig": "function (_self, dd, targetId, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires while row(s) are being dragged. \"targetId\" is the id of the Yahoo.util.DD object the selected rows are being dragged over."
+    },
+    {
+     "name": "enddrag",
+     "sig": "function (_self, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a drag operation is complete"
+    },
+    {
+     "name": "headerclick",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header is clicked"
+    },
+    {
+     "name": "headercontextmenu",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header is right clicked"
+    },
+    {
+     "name": "headerdblclick",
+     "sig": "function (_self, columnIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a header cell is double clicked"
+    },
+    {
+     "name": "keydown",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw keydown event for the entire grid."
+    },
+    {
+     "name": "keypress",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw keypress event for the entire grid."
+    },
+    {
+     "name": "mousedown",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mousedown event for the entire grid."
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseout event for the entire grid."
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseover event for the entire grid."
+    },
+    {
+     "name": "mouseup",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "The raw mouseup event for the entire grid."
+    },
+    {
+     "name": "propertychange",
+     "sig": "function (grid, id, newval, oldval)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a property changes"
+    },
+    {
+     "name": "render",
+     "sig": "function (grid)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the grid is rendered"
+    },
+    {
+     "name": "rowclick",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is clicked"
+    },
+    {
+     "name": "rowcontextmenu",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is right clicked"
+    },
+    {
+     "name": "rowdblclick",
+     "sig": "function (_self, rowIndex, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is double clicked"
+    },
+    {
+     "name": "startdrag",
+     "sig": "function (_self, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when row(s) start being dragged"
+    },
+    {
+     "name": "validateedit",
+     "sig": "function (e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a cell is edited, but before the value is set in the record. \nYou can use this to modify the value being set in the field, Return false\nto cancel the change. The edit event object has the following properties <br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>editor - This editor</li>\n<li>grid - This grid</li>\n<li>record - The record being edited</li>\n<li>field - The field name being edited</li>\n<li>value - The value being set</li>\n<li>originalValue - The original value for the field, before the edit.</li>\n<li>row - The grid row index</li>\n<li>column - The grid column index</li>\n<li>cancel - Set this to true to cancel the edit or return false from your handler.</li>\n</ul>"
+    }
+   ]
+  },
+  "Roo.grid.RowSelectionModel": {
+   "props": [
+    {
+     "name": "singleSelect",
+     "type": "Boolean",
+     "desc": "True to allow selection of only one row at a time (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "afterselectionchange",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the selection changes (eg. by key press or clicking)"
+    },
+    {
+     "name": "beforerowselect",
+     "sig": "function (_self, rowIndex, keepExisting)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is selected being selected, return false to cancel."
+    },
+    {
+     "name": "rowdeselect",
+     "sig": "function (_self, rowIndex)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is deselected."
+    },
+    {
+     "name": "rowselect",
+     "sig": "function (_self, rowIndex, r)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a row is selected."
+    },
+    {
+     "name": "selectionchange",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the selection changes"
+    }
+   ]
+  },
+  "Roo.menu": {
+   "props": [],
+   "events": []
+  },
+  "Roo.menu.Adapter": {
+   "props": [
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to false)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to true)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.BaseItem": {
+   "props": [
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": ""
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": ""
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": ""
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.CheckItem": {
+   "props": [
+    {
+     "name": "group",
+     "type": "String",
+     "desc": "All check items with the same group name will automatically be grouped into a single-select\nradio button group (defaults to '')",
+     "memberOf": ""
+    },
+    {
+     "name": "itemCls",
+     "type": "String",
+     "desc": "The default CSS class to use for check items (defaults to \"x-menu-item x-menu-check-item\")",
+     "memberOf": ""
+    },
+    {
+     "name": "groupClass",
+     "type": "String",
+     "desc": "The default CSS class to use for radio group check items (defaults to \"x-menu-group-item\")",
+     "memberOf": ""
+    },
+    {
+     "name": "checked",
+     "type": "Boolean",
+     "desc": "True to initialize this checkbox as checked (defaults to false).  Note that\nif this checkbox is part of a radio group (group = true) only the last item in the group that is\ninitialized with checked = true will be rendered as checked.",
+     "memberOf": ""
+    },
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The text to show on the menu item.",
+     "memberOf": "Roo.menu.Item"
+    },
+    {
+     "name": "HTML",
+     "type": "String",
+     "desc": "to render in menu\nThe text to show on the menu item (HTML version).",
+     "memberOf": "Roo.menu.Item"
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an icon to display in this menu item (defaults to Roo.BLANK_IMAGE_URL)",
+     "memberOf": "Roo.menu.Item"
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to true)",
+     "memberOf": "Roo.menu.Item"
+    },
+    {
+     "name": "showDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before showing this item (defaults to 200)",
+     "memberOf": "Roo.menu.Item"
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to true)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforecheckchange",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the checked value is set, providing an opportunity to cancel if needed"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "checkchange",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the checked value has been set"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.ColorItem": {
+   "props": [
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to false)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to true)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.ColorMenu": {
+   "props": [
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width of the menu in pixels (defaults to 120)",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\"\nfor bottom-right shadow (defaults to \"sides\")",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "subMenuAlign",
+     "type": "String",
+     "desc": "The {@link Roo.Element#alignTo} anchor position value to use for submenus of\nthis menu (defaults to \"tl-tr?\")",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "defaultAlign",
+     "type": "String",
+     "desc": "The default {@link Roo.Element#alignTo) anchor position value for this menu\nrelative to its element of origin (defaults to \"tl-bl?\")",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "allowOtherMenus",
+     "type": "Boolean",
+     "desc": "True to allow multiple menus to be displayed at the same time (defaults to false)",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "registerMenu",
+     "type": "Boolean",
+     "desc": "True (default) - means that clicking on screen etc. hides it.",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this menu is hidden"
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this menu is displayed"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, menuItem, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this menu is clicked (or when the enter key is pressed while it is active)"
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after this menu is hidden"
+    },
+    {
+     "name": "itemclick",
+     "sig": "function (baseItem, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a menu item contained in this menu is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e, menuItem)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits this menu"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e, menuItem)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse is hovering over this menu"
+    },
+    {
+     "name": "select",
+     "sig": "function (palette, color)\n{\n\n}",
+     "type": "function",
+     "desc": ""
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after this menu is displayed"
+    }
+   ]
+  },
+  "Roo.menu.DateItem": {
+   "props": [
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to false)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to true)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.DateMenu": {
+   "props": [
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width of the menu in pixels (defaults to 120)",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\"\nfor bottom-right shadow (defaults to \"sides\")",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "subMenuAlign",
+     "type": "String",
+     "desc": "The {@link Roo.Element#alignTo} anchor position value to use for submenus of\nthis menu (defaults to \"tl-tr?\")",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "defaultAlign",
+     "type": "String",
+     "desc": "The default {@link Roo.Element#alignTo) anchor position value for this menu\nrelative to its element of origin (defaults to \"tl-bl?\")",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "allowOtherMenus",
+     "type": "Boolean",
+     "desc": "True to allow multiple menus to be displayed at the same time (defaults to false)",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "registerMenu",
+     "type": "Boolean",
+     "desc": "True (default) - means that clicking on screen etc. hides it.",
+     "memberOf": "Roo.menu.Menu"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this menu is hidden"
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this menu is displayed"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, menuItem, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this menu is clicked (or when the enter key is pressed while it is active)"
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after this menu is hidden"
+    },
+    {
+     "name": "itemclick",
+     "sig": "function (baseItem, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a menu item contained in this menu is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e, menuItem)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits this menu"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e, menuItem)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse is hovering over this menu"
+    },
+    {
+     "name": "select",
+     "sig": "function (picker, date)\n{\n\n}",
+     "type": "function",
+     "desc": ""
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after this menu is displayed"
+    }
+   ]
+  },
+  "Roo.menu.Item": {
+   "props": [
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The text to show on the menu item.",
+     "memberOf": ""
+    },
+    {
+     "name": "HTML",
+     "type": "String",
+     "desc": "to render in menu\nThe text to show on the menu item (HTML version).",
+     "memberOf": ""
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an icon to display in this menu item (defaults to Roo.BLANK_IMAGE_URL)",
+     "memberOf": ""
+    },
+    {
+     "name": "itemCls",
+     "type": "String",
+     "desc": "The default CSS class to use for menu items (defaults to \"x-menu-item\")",
+     "memberOf": ""
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "showDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before showing this item (defaults to 200)",
+     "memberOf": ""
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to true)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.Menu": {
+   "props": [
+    {
+     "name": "minWidth",
+     "type": "Number",
+     "desc": "The minimum width of the menu in pixels (defaults to 120)",
+     "memberOf": ""
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "True or \"sides\" for the default effect, \"frame\" for 4-way shadow, and \"drop\"\nfor bottom-right shadow (defaults to \"sides\")",
+     "memberOf": ""
+    },
+    {
+     "name": "subMenuAlign",
+     "type": "String",
+     "desc": "The {@link Roo.Element#alignTo} anchor position value to use for submenus of\nthis menu (defaults to \"tl-tr?\")",
+     "memberOf": ""
+    },
+    {
+     "name": "defaultAlign",
+     "type": "String",
+     "desc": "The default {@link Roo.Element#alignTo) anchor position value for this menu\nrelative to its element of origin (defaults to \"tl-bl?\")",
+     "memberOf": ""
+    },
+    {
+     "name": "allowOtherMenus",
+     "type": "Boolean",
+     "desc": "True to allow multiple menus to be displayed at the same time (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "registerMenu",
+     "type": "Boolean",
+     "desc": "True (default) - means that clicking on screen etc. hides it.",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this menu is hidden"
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this menu is displayed"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, menuItem, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this menu is clicked (or when the enter key is pressed while it is active)"
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after this menu is hidden"
+    },
+    {
+     "name": "itemclick",
+     "sig": "function (baseItem, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a menu item contained in this menu is clicked"
+    },
+    {
+     "name": "mouseout",
+     "sig": "function (_self, e, menuItem)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse exits this menu"
+    },
+    {
+     "name": "mouseover",
+     "sig": "function (_self, e, menuItem)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse is hovering over this menu"
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after this menu is displayed"
+    }
+   ]
+  },
+  "Roo.menu.MenuMgr": {
+   "props": [],
+   "events": []
+  },
+  "Roo.menu.Separator": {
+   "props": [
+    {
+     "name": "itemCls",
+     "type": "String",
+     "desc": "The default CSS class to use for separators (defaults to \"x-menu-sep\")",
+     "memberOf": ""
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to false)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.menu.TextItem": {
+   "props": [
+    {
+     "name": "text",
+     "type": "Boolean",
+     "desc": "Text to show on item.",
+     "memberOf": ""
+    },
+    {
+     "name": "hideOnClick",
+     "type": "Boolean",
+     "desc": "True to hide the containing menu after this item is clicked (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "itemCls",
+     "type": "String",
+     "desc": "The default CSS class to use for text items (defaults to \"x-menu-text\")",
+     "memberOf": ""
+    },
+    {
+     "name": "handler",
+     "type": "Function",
+     "desc": "A function that will handle the click event of this menu item (defaults to undefined)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "canActivate",
+     "type": "Boolean",
+     "desc": "True if this item can be visually activated (defaults to false)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "activeClass",
+     "type": "String",
+     "desc": "The CSS class to use when the item becomes activated (defaults to \"x-menu-item-active\")",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "hideDelay",
+     "type": "Number",
+     "desc": "Length of time in milliseconds to wait before hiding after a click (defaults to 100)",
+     "memberOf": "Roo.menu.BaseItem"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "activate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is activated"
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is clicked"
+    },
+    {
+     "name": "deactivate",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this item is deactivated"
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    }
+   ]
+  },
+  "Roo.state": {
+   "props": [],
+   "events": []
+  },
+  "Roo.state.CookieProvider": {
+   "props": [
+    {
+     "name": "path",
+     "type": "String",
+     "desc": "The path for which the cookie is active (defaults to root '/' which makes it active for all pages in the site)",
+     "memberOf": ""
+    },
+    {
+     "name": "expires",
+     "type": "Date",
+     "desc": "The cookie expiration date (defaults to 7 days from now)",
+     "memberOf": ""
+    },
+    {
+     "name": "domain",
+     "type": "String",
+     "desc": "The domain to save the cookie for.  Note that you cannot specify a different domain than\nyour page is on, but you can specify a sub-domain, or simply the domain itself like 'roojs.com' to include\nall sub-domains if you need to access cookies across different sub-domains (defaults to null which uses the same\ndomain the page is running on including the 'www' like 'www.roojs.com')",
+     "memberOf": ""
+    },
+    {
+     "name": "secure",
+     "type": "Boolean",
+     "desc": "True if the site is using SSL (defaults to false)",
+     "memberOf": ""
+    }
+   ],
+   "events": [
+    {
+     "name": "statechange",
+     "sig": "function (_self, key, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a state change occurs."
+    }
+   ]
+  },
+  "Roo.state.Manager": {
+   "props": [],
+   "events": []
+  },
+  "Roo.state.Provider": {
+   "props": [],
+   "events": [
+    {
+     "name": "statechange",
+     "sig": "function (_self, key, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a state change occurs."
+    }
+   ]
+  },
+  "Roo.tree": {
+   "props": [],
+   "events": []
+  },
+  "Roo.tree.AsyncTreeNode": {
+   "props": [
+    {
+     "name": "loader",
+     "type": "TreeLoader",
+     "desc": "A TreeLoader to be used by this node (defaults to the loader defined on the tree)",
+     "memberOf": ""
+    },
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The text for this node",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "expanded",
+     "type": "Boolean",
+     "desc": "true to start the node expanded",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "allowDrag",
+     "type": "Boolean",
+     "desc": "false to make this node undraggable if DD is on (defaults to true)",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "allowDrop",
+     "type": "Boolean",
+     "desc": "false if this node cannot be drop on",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "true to start the node disabled",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an icon for the node. The preferred way to do this",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A css class to be added to the node",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "iconCls",
+     "type": "String",
+     "desc": "A css class to be added to the nodes icon element for applying css background images",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "href",
+     "type": "String",
+     "desc": "URL of the link used for the node (defaults to #)",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "hrefTarget",
+     "type": "String",
+     "desc": "target frame for the link",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "An Ext QuickTip for the node",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "qtipCfg",
+     "type": "String",
+     "desc": "An Ext QuickTip config for the node (used instead of qtip)",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "singleClickExpand",
+     "type": "Boolean",
+     "desc": "True for single click expand on this node",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "uiProvider",
+     "type": "Function",
+     "desc": "A UI <b>class</b> to use for this node (defaults to Roo.tree.TreeNodeUI)",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "checked",
+     "type": "Boolean",
+     "desc": "True to render a checked checkbox for this node, false to render an unchecked checkbox\n(defaults to undefined with no checkbox rendered)",
+     "memberOf": "Roo.tree.TreeNode"
+    },
+    {
+     "name": "leaf",
+     "type": "Boolean",
+     "desc": "true if this node is a leaf and does not have children",
+     "memberOf": "Roo.data.Node"
+    },
+    {
+     "name": "id",
+     "type": "String",
+     "desc": "The id for this node. If one is not specified, one is generated.",
+     "memberOf": "Roo.data.Node"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "append",
+     "sig": "function (tree, _self, node, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is appended"
+    },
+    {
+     "name": "beforeappend",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is appended, return false to cancel the append."
+    },
+    {
+     "name": "beforechildrenrendered",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires right before the child nodes for this node are rendered"
+    },
+    {
+     "name": "beforeclick",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before click processing. Return false to cancel the default action."
+    },
+    {
+     "name": "beforecollapse",
+     "sig": "function (_self, deep, anim)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is collapsed, return false to cancel."
+    },
+    {
+     "name": "beforeexpand",
+     "sig": "function (_self, deep, anim)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is expanded, return false to cancel."
+    },
+    {
+     "name": "beforeinsert",
+     "sig": "function (tree, _self, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is inserted, return false to cancel the insert."
+    },
+    {
+     "name": "beforeload",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is loaded, return false to cancel"
+    },
+    {
+     "name": "beforemove",
+     "sig": "function (tree, _self, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is moved to a new location in the tree. Return false to cancel the move."
+    },
+    {
+     "name": "beforeremove",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a child is removed, return false to cancel the remove."
+    },
+    {
+     "name": "checkchange",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node with a checkbox's checked property changes"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is clicked"
+    },
+    {
+     "name": "collapse",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is collapsed"
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is right clicked"
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is double clicked"
+    },
+    {
+     "name": "disabledchange",
+     "sig": "function (_self, disabled)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the disabled status of this node changes"
+    },
+    {
+     "name": "expand",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is expanded"
+    },
+    {
+     "name": "insert",
+     "sig": "function (tree, _self, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is inserted."
+    },
+    {
+     "name": "load",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is loaded"
+    },
+    {
+     "name": "move",
+     "sig": "function (tree, _self, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is moved to a new location in the tree"
+    },
+    {
+     "name": "remove",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a child node is removed"
+    },
+    {
+     "name": "textchange",
+     "sig": "function (_self, text, oldText)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the text for this node is changed"
+    }
+   ]
+  },
+  "Roo.tree.ColumnTree": {
+   "props": [
+    {
+     "name": "columns",
+     "type": "Object",
+     "desc": "Including width, header, renderer, cls, dataIndex",
+     "memberOf": ""
+    },
+    {
+     "name": "borderWidth",
+     "type": "int",
+     "desc": "compined right/left border allowance",
+     "memberOf": ""
+    }
+   ],
+   "events": [
+    {
+     "name": "resize",
+     "sig": "function (w, h)\n{\n\n}",
+     "type": "function",
+     "desc": "Fire this event on a container when it resizes"
+    }
+   ]
+  },
+  "Roo.tree.DefaultSelectionModel": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeselect",
+     "sig": "function (_self, node, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the selected node changes, return false to cancel the change"
+    },
+    {
+     "name": "selectionchange",
+     "sig": "function (_self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the selected node changes"
+    }
+   ]
+  },
+  "Roo.tree.MultiSelectionModel": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "selectionchange",
+     "sig": "function (_self, nodes)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the selected nodes change"
+    }
+   ]
+  },
+  "Roo.tree.TreeEditor": {
+   "props": [
+    {
+     "name": "alignment",
+     "type": "String",
+     "desc": "The position to align to (see {@link Roo.Element#alignTo} for more details, defaults to \"l-l\").",
+     "memberOf": ""
+    },
+    {
+     "name": "hideEl",
+     "type": "Boolean",
+     "desc": "True to hide the bound element while the editor is displayed (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "CSS class to apply to the editor (defaults to \"x-small-editor x-tree-editor\")",
+     "memberOf": ""
+    },
+    {
+     "name": "shim",
+     "type": "Boolean",
+     "desc": "True to shim the editor if selects/iframes could be displayed beneath it (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "maxWidth",
+     "type": "Number",
+     "desc": "The maximum width in pixels of the editor field (defaults to 250).  Note that if the maxWidth would exceed\nthe containing tree element's size, it will be automatically limited for you to the container width, taking\nscroll and client offsets into account prior to each edit.",
+     "memberOf": ""
+    },
+    {
+     "name": "autosize",
+     "type": "Boolean/String",
+     "desc": "True for the editor to automatically adopt the size of the underlying field, \"width\" to adopt the width only,\nor \"height\" to adopt the height only (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "revertInvalid",
+     "type": "Boolean",
+     "desc": "True to automatically revert the field value and cancel the edit when the user completes an edit and the field\nvalidation fails (defaults to true)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "ignoreNoChange",
+     "type": "Boolean",
+     "desc": "True to skip the the edit completion process (no save, no events fired) if the user completes an edit and\nthe value has not changed (defaults to false).  Applies only to string values - edits for other data types\nwill never be ignored.",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "value",
+     "type": "Mixed",
+     "desc": "The data value of the underlying field (defaults to \"\")",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "shadow",
+     "type": "Boolean/String",
+     "desc": "\"sides\" for sides/bottom only, \"frame\" for 4-way shadow, and \"drop\"\nfor bottom-right shadow (defaults to \"frame\")",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "constrain",
+     "type": "Boolean",
+     "desc": "True to constrain the editor to the viewport",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "completeOnEnter",
+     "type": "Boolean",
+     "desc": "True to complete the edit when the enter key is pressed (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "cancelOnEsc",
+     "type": "Boolean",
+     "desc": "True to cancel the edit when the escape key is pressed (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "updateEl",
+     "type": "Boolean",
+     "desc": "True to update the innerHTML of the bound element when the update completes (defaults to false)",
+     "memberOf": "Roo.Editor"
+    },
+    {
+     "name": "disableClass",
+     "type": "String",
+     "desc": "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "allowDomMove",
+     "type": "Boolean",
+     "desc": "Whether the component can move the Dom node when rendering (defaults to true).",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "hideMode",
+     "type": "String",
+     "desc": "How this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "actionMode",
+     "type": "String",
+     "desc": "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el'",
+     "memberOf": "Roo.Component"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforecomplete",
+     "sig": "function (_self, value, startValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a change has been made to the field, but before the change is reflected in the underlying\nfield.  Saving the change to the field can be canceled by returning false from the handler of this event.\nNote that if the value has not changed and ignoreNoChange = true, the editing will still end but this\nevent will not fire since no edit actually occurred."
+    },
+    {
+     "name": "beforedestroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is destroyed. Return false to stop the destroy."
+    },
+    {
+     "name": "beforehide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is hidden. Return false to stop the hide."
+    },
+    {
+     "name": "beforerender",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is rendered. Return false to stop the render."
+    },
+    {
+     "name": "beforeshow",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before the component is shown.  Return false to stop the show."
+    },
+    {
+     "name": "beforestartedit",
+     "sig": "function (_self, boundEl, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when editing is initiated, but before the value changes.  Editing can be canceled by returning\nfalse from the handler of this event."
+    },
+    {
+     "name": "complete",
+     "sig": "function (_self, value, startValue)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after editing is complete and any changed value has been written to the underlying field."
+    },
+    {
+     "name": "destroy",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is destroyed."
+    },
+    {
+     "name": "disable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is disabled."
+    },
+    {
+     "name": "enable",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is enabled."
+    },
+    {
+     "name": "hide",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is hidden."
+    },
+    {
+     "name": "render",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is rendered."
+    },
+    {
+     "name": "show",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after the component is shown."
+    },
+    {
+     "name": "specialkey",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check\n{@link Roo.EventObject#getKey} to determine which key was pressed."
+    },
+    {
+     "name": "startedit",
+     "sig": "function (boundEl, value)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this editor is displayed"
+    }
+   ]
+  },
+  "Roo.tree.TreeFilter": {
+   "props": [],
+   "events": []
+  },
+  "Roo.tree.TreeLoader": {
+   "props": [
+    {
+     "name": "dataUrl",
+     "type": "String",
+     "desc": "The URL from which to request a Json string which\nspecifies an array of node definition object representing the child nodes\nto be loaded.",
+     "memberOf": ""
+    },
+    {
+     "name": "baseParams",
+     "type": "Object",
+     "desc": "(optional) An object containing properties which\nspecify HTTP parameters to be passed to each request for child nodes.",
+     "memberOf": ""
+    },
+    {
+     "name": "baseAttrs",
+     "type": "Object",
+     "desc": "(optional) An object containing attributes to be added to all nodes\ncreated by this loader. If the attributes sent by the server have an attribute in this object,\nthey take priority.",
+     "memberOf": ""
+    },
+    {
+     "name": "uiProviders",
+     "type": "Object",
+     "desc": "(optional) An object containing properties which\n\nDEPRECIATED - use 'create' event handler to modify attributes - which affect creation.\nspecify custom {@link Roo.tree.TreeNodeUI} implementations. If the optional\n<i>uiProvider</i> attribute of a returned child node is a string rather\nthan a reference to a TreeNodeUI implementation, this that string value\nis used as a property name in the uiProviders object. You can define the provider named\n'default' , and this will be used for all nodes (if no uiProvider is delivered by the node data)",
+     "memberOf": ""
+    },
+    {
+     "name": "clearOnLoad",
+     "type": "Boolean",
+     "desc": "(optional) Default to true. Remove previously existing\nchild nodes before loading.",
+     "memberOf": ""
+    },
+    {
+     "name": "root",
+     "type": "String",
+     "desc": "(optional) Default to false. Use this to read data from an object \nproperty on loading, rather than expecting an array. (eg. more compatible to a standard\nGrid query { data : [ .....] }",
+     "memberOf": ""
+    },
+    {
+     "name": "queryParam",
+     "type": "String",
+     "desc": "(optional) \nName of the query as it will be passed on the querystring (defaults to 'node')\neg. the request will be ?node=[id]",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "beforeload",
+     "sig": "function (This, node, callback)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a network request is made to retrieve the Json text which specifies a node's children."
+    },
+    {
+     "name": "create",
+     "sig": "function (This, attr)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a node is created, enabling you to return custom Node types"
+    },
+    {
+     "name": "load",
+     "sig": "function (This, node, response)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the node has been successfuly loaded."
+    },
+    {
+     "name": "loadexception",
+     "sig": "function (This, node, response)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires if the network request failed."
+    }
+   ]
+  },
+  "Roo.tree.TreeNode": {
+   "props": [
+    {
+     "name": "text",
+     "type": "String",
+     "desc": "The text for this node",
+     "memberOf": ""
+    },
+    {
+     "name": "expanded",
+     "type": "Boolean",
+     "desc": "true to start the node expanded",
+     "memberOf": ""
+    },
+    {
+     "name": "allowDrag",
+     "type": "Boolean",
+     "desc": "false to make this node undraggable if DD is on (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "allowDrop",
+     "type": "Boolean",
+     "desc": "false if this node cannot be drop on",
+     "memberOf": ""
+    },
+    {
+     "name": "disabled",
+     "type": "Boolean",
+     "desc": "true to start the node disabled",
+     "memberOf": ""
+    },
+    {
+     "name": "icon",
+     "type": "String",
+     "desc": "The path to an icon for the node. The preferred way to do this",
+     "memberOf": ""
+    },
+    {
+     "name": "cls",
+     "type": "String",
+     "desc": "A css class to be added to the node",
+     "memberOf": ""
+    },
+    {
+     "name": "iconCls",
+     "type": "String",
+     "desc": "A css class to be added to the nodes icon element for applying css background images",
+     "memberOf": ""
+    },
+    {
+     "name": "href",
+     "type": "String",
+     "desc": "URL of the link used for the node (defaults to #)",
+     "memberOf": ""
+    },
+    {
+     "name": "hrefTarget",
+     "type": "String",
+     "desc": "target frame for the link",
+     "memberOf": ""
+    },
+    {
+     "name": "qtip",
+     "type": "String",
+     "desc": "An Ext QuickTip for the node",
+     "memberOf": ""
+    },
+    {
+     "name": "qtipCfg",
+     "type": "String",
+     "desc": "An Ext QuickTip config for the node (used instead of qtip)",
+     "memberOf": ""
+    },
+    {
+     "name": "singleClickExpand",
+     "type": "Boolean",
+     "desc": "True for single click expand on this node",
+     "memberOf": ""
+    },
+    {
+     "name": "uiProvider",
+     "type": "Function",
+     "desc": "A UI <b>class</b> to use for this node (defaults to Roo.tree.TreeNodeUI)",
+     "memberOf": ""
+    },
+    {
+     "name": "checked",
+     "type": "Boolean",
+     "desc": "True to render a checked checkbox for this node, false to render an unchecked checkbox\n(defaults to undefined with no checkbox rendered)",
+     "memberOf": ""
+    },
+    {
+     "name": "leaf",
+     "type": "Boolean",
+     "desc": "true if this node is a leaf and does not have children",
+     "memberOf": "Roo.data.Node"
+    },
+    {
+     "name": "id",
+     "type": "String",
+     "desc": "The id for this node. If one is not specified, one is generated.",
+     "memberOf": "Roo.data.Node"
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "append",
+     "sig": "function (tree, _self, node, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is appended"
+    },
+    {
+     "name": "beforeappend",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is appended, return false to cancel the append."
+    },
+    {
+     "name": "beforechildrenrendered",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires right before the child nodes for this node are rendered"
+    },
+    {
+     "name": "beforeclick",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before click processing. Return false to cancel the default action."
+    },
+    {
+     "name": "beforecollapse",
+     "sig": "function (_self, deep, anim)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is collapsed, return false to cancel."
+    },
+    {
+     "name": "beforeexpand",
+     "sig": "function (_self, deep, anim)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is expanded, return false to cancel."
+    },
+    {
+     "name": "beforeinsert",
+     "sig": "function (tree, _self, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is inserted, return false to cancel the insert."
+    },
+    {
+     "name": "beforemove",
+     "sig": "function (tree, _self, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before this node is moved to a new location in the tree. Return false to cancel the move."
+    },
+    {
+     "name": "beforeremove",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a child is removed, return false to cancel the remove."
+    },
+    {
+     "name": "checkchange",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node with a checkbox's checked property changes"
+    },
+    {
+     "name": "click",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is clicked"
+    },
+    {
+     "name": "collapse",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is collapsed"
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is right clicked"
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (_self, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is double clicked"
+    },
+    {
+     "name": "disabledchange",
+     "sig": "function (_self, disabled)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the disabled status of this node changes"
+    },
+    {
+     "name": "expand",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is expanded"
+    },
+    {
+     "name": "insert",
+     "sig": "function (tree, _self, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is inserted."
+    },
+    {
+     "name": "move",
+     "sig": "function (tree, _self, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when this node is moved to a new location in the tree"
+    },
+    {
+     "name": "remove",
+     "sig": "function (tree, _self, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a child node is removed"
+    },
+    {
+     "name": "textchange",
+     "sig": "function (_self, text, oldText)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the text for this node is changed"
+    }
+   ]
+  },
+  "Roo.tree.TreeNodeUI": {
+   "props": [],
+   "events": []
+  },
+  "Roo.tree.TreePanel": {
+   "props": [
+    {
+     "name": "rootVisible",
+     "type": "Boolean",
+     "desc": "false to hide the root node (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "lines",
+     "type": "Boolean",
+     "desc": "false to disable tree lines (defaults to true)",
+     "memberOf": ""
+    },
+    {
+     "name": "enableDD",
+     "type": "Boolean",
+     "desc": "true to enable drag and drop",
+     "memberOf": ""
+    },
+    {
+     "name": "enableDrag",
+     "type": "Boolean",
+     "desc": "true to enable just drag",
+     "memberOf": ""
+    },
+    {
+     "name": "enableDrop",
+     "type": "Boolean",
+     "desc": "true to enable just drop",
+     "memberOf": ""
+    },
+    {
+     "name": "dragConfig",
+     "type": "Object",
+     "desc": "Custom config to pass to the {@link Roo.tree.TreeDragZone} instance",
+     "memberOf": ""
+    },
+    {
+     "name": "dropConfig",
+     "type": "Object",
+     "desc": "Custom config to pass to the {@link Roo.tree.TreeDropZone} instance",
+     "memberOf": ""
+    },
+    {
+     "name": "ddGroup",
+     "type": "String",
+     "desc": "The DD group this TreePanel belongs to",
+     "memberOf": ""
+    },
+    {
+     "name": "ddAppendOnly",
+     "type": "String",
+     "desc": "True if the tree should only allow append drops (use for trees which are sorted)",
+     "memberOf": ""
+    },
+    {
+     "name": "ddScroll",
+     "type": "Boolean",
+     "desc": "true to enable YUI body scrolling",
+     "memberOf": ""
+    },
+    {
+     "name": "containerScroll",
+     "type": "Boolean",
+     "desc": "true to register this container with ScrollManager",
+     "memberOf": ""
+    },
+    {
+     "name": "hlDrop",
+     "type": "Boolean",
+     "desc": "false to disable node highlight on drop (defaults to the value of Roo.enableFx)",
+     "memberOf": ""
+    },
+    {
+     "name": "hlColor",
+     "type": "String",
+     "desc": "The color of the node highlight (defaults to C3DAF9)",
+     "memberOf": ""
+    },
+    {
+     "name": "animate",
+     "type": "Boolean",
+     "desc": "true to enable animated expand/collapse (defaults to the value of Roo.enableFx)",
+     "memberOf": ""
+    },
+    {
+     "name": "singleExpand",
+     "type": "Boolean",
+     "desc": "true if only 1 node per branch may be expanded",
+     "memberOf": ""
+    },
+    {
+     "name": "selModel",
+     "type": "Boolean",
+     "desc": "A tree selection model to use with this TreePanel (defaults to a {@link Roo.tree.DefaultSelectionModel})",
+     "memberOf": ""
+    },
+    {
+     "name": "loader",
+     "type": "Boolean",
+     "desc": "A TreeLoader for use with this TreePanel",
+     "memberOf": ""
+    },
+    {
+     "name": "pathSeparator",
+     "type": "String",
+     "desc": "The token used to separate sub-paths in path strings (defaults to '/')",
+     "memberOf": ""
+    },
+    {
+     "name": "renderer",
+     "type": "Function",
+     "desc": "Sets the rendering (formatting) function for the nodes. to return HTML markup for the tree view. The render function is called with  the following parameters:<ul><li>The {Object} The data for the node.</li></ul>",
+     "memberOf": ""
+    },
+    {
+     "name": "rendererTip",
+     "type": "Function",
+     "desc": "Sets the rendering (formatting) function for the nodes hovertip to return HTML markup for the tree view. The render function is called with  the following parameters:<ul><li>The {Object} The data for the node.</li></ul>",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "append",
+     "sig": "function (tree, parent, node, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is appended to a node in this tree."
+    },
+    {
+     "name": "beforeappend",
+     "sig": "function (tree, parent, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is appended to a node in this tree, return false to cancel the append."
+    },
+    {
+     "name": "beforechildrenrendered",
+     "sig": "function (node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires right before the child nodes for a node are rendered"
+    },
+    {
+     "name": "beforeclick",
+     "sig": "function (node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before click processing on a node. Return false to cancel the default action."
+    },
+    {
+     "name": "beforecollapse",
+     "sig": "function (node, deep, anim)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a node is collapsed, return false to cancel."
+    },
+    {
+     "name": "beforeexpand",
+     "sig": "function (node, deep, anim)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a node is expanded, return false to cancel."
+    },
+    {
+     "name": "beforeinsert",
+     "sig": "function (tree, parent, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a new child is inserted in a node in this tree, return false to cancel the insert."
+    },
+    {
+     "name": "beforeload",
+     "sig": "function (node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a node is loaded, return false to cancel"
+    },
+    {
+     "name": "beforemove",
+     "sig": "function (tree, node, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a node is moved to a new location in the tree. Return false to cancel the move."
+    },
+    {
+     "name": "beforenodedrop",
+     "sig": "function (dropEvent)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a DD object is dropped on a node in this tree for preprocessing. Return false to cancel the drop. The dropEvent\npassed to handlers has the following properties:<br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>tree - The TreePanel</li>\n<li>target - The node being targeted for the drop</li>\n<li>data - The drag data from the drag source</li>\n<li>point - The point of the drop - append, above or below</li>\n<li>source - The drag source</li>\n<li>rawEvent - Raw mouse event</li>\n<li>dropNode - Drop node(s) provided by the source <b>OR</b> you can supply node(s)\nto be inserted by setting them on this object.</li>\n<li>cancel - Set this to true to cancel the drop.</li>\n</ul>"
+    },
+    {
+     "name": "beforeremove",
+     "sig": "function (tree, parent, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires before a child is removed from a node in this tree, return false to cancel the remove."
+    },
+    {
+     "name": "checkchange",
+     "sig": "function (_self, checked)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node with a checkbox's checked property changes"
+    },
+    {
+     "name": "click",
+     "sig": "function (node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is clicked"
+    },
+    {
+     "name": "collapse",
+     "sig": "function (node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is collapsed"
+    },
+    {
+     "name": "contextmenu",
+     "sig": "function (node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is right clicked"
+    },
+    {
+     "name": "dblclick",
+     "sig": "function (node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is double clicked"
+    },
+    {
+     "name": "disabledchange",
+     "sig": "function (node, disabled)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the disabled status of a node changes"
+    },
+    {
+     "name": "dragdrop",
+     "sig": "function (_self, node, dd, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a dragged node is dropped on a valid DD target"
+    },
+    {
+     "name": "enddrag",
+     "sig": "function (_self, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a drag operation is complete"
+    },
+    {
+     "name": "expand",
+     "sig": "function (node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is expanded"
+    },
+    {
+     "name": "insert",
+     "sig": "function (tree, parent, node, refNode)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a new child node is inserted in a node in this tree."
+    },
+    {
+     "name": "load",
+     "sig": "function (node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is loaded"
+    },
+    {
+     "name": "move",
+     "sig": "function (tree, node, oldParent, newParent, index)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node is moved to a new location in the tree"
+    },
+    {
+     "name": "nodedragover",
+     "sig": "function (dragOverEvent)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a tree node is being targeted for a drag drop, return false to signal drop not allowed. The dragOverEvent\npassed to handlers has the following properties:<br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>tree - The TreePanel</li>\n<li>target - The node being targeted for the drop</li>\n<li>data - The drag data from the drag source</li>\n<li>point - The point of the drop - append, above or below</li>\n<li>source - The drag source</li>\n<li>rawEvent - Raw mouse event</li>\n<li>dropNode - Drop node(s) provided by the source.</li>\n<li>cancel - Set this to true to signal drop not allowed.</li>\n</ul>"
+    },
+    {
+     "name": "nodedrop",
+     "sig": "function (dropEvent)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires after a DD object is dropped on a node in this tree. The dropEvent\npassed to handlers has the following properties:<br />\n<ul style=\"padding:5px;padding-left:16px;\">\n<li>tree - The TreePanel</li>\n<li>target - The node being targeted for the drop</li>\n<li>data - The drag data from the drag source</li>\n<li>point - The point of the drop - append, above or below</li>\n<li>source - The drag source</li>\n<li>rawEvent - Raw mouse event</li>\n<li>dropNode - Dropped node(s).</li>\n</ul>"
+    },
+    {
+     "name": "remove",
+     "sig": "function (tree, parent, node)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a child node is removed from a node in this tree."
+    },
+    {
+     "name": "startdrag",
+     "sig": "function (_self, node, e)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when a node starts being dragged"
+    },
+    {
+     "name": "textchange",
+     "sig": "function (node, text, oldText)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the text for a node is changed"
+    }
+   ]
+  },
+  "Roo.tree.TreeSorter": {
+   "props": [
+    {
+     "name": "folderSort",
+     "type": "Boolean",
+     "desc": "True to sort leaf nodes under non leaf nodes",
+     "memberOf": ""
+    },
+    {
+     "name": "property",
+     "type": "String",
+     "desc": "The named attribute on the node to sort by (defaults to text)",
+     "memberOf": ""
+    },
+    {
+     "name": "dir",
+     "type": "String",
+     "desc": "The direction to sort (asc or desc) (defaults to asc)",
+     "memberOf": ""
+    },
+    {
+     "name": "leafAttr",
+     "type": "String",
+     "desc": "The attribute used to determine leaf nodes in folder sort (defaults to \"leaf\")",
+     "memberOf": ""
+    },
+    {
+     "name": "caseSensitive",
+     "type": "Boolean",
+     "desc": "true for case sensitive sort (defaults to false)",
+     "memberOf": ""
+    },
+    {
+     "name": "sortType",
+     "type": "Function",
+     "desc": "A custom \"casting\" function used to convert node values before sorting",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.util": {
+   "props": [],
+   "events": []
+  },
+  "Roo.util.CSS": {
+   "props": [],
+   "events": []
+  },
+  "Roo.util.ClickRepeater": {
+   "props": [
+    {
+     "name": "el",
+     "type": "String/HTMLElement/Element",
+     "desc": "The element to act as a button.",
+     "memberOf": ""
+    },
+    {
+     "name": "delay",
+     "type": "Number",
+     "desc": "The initial delay before the repeating event begins firing.\nSimilar to an autorepeat key delay.",
+     "memberOf": ""
+    },
+    {
+     "name": "interval",
+     "type": "Number",
+     "desc": "The interval between firings of the \"click\" event. Default 10 ms.",
+     "memberOf": ""
+    },
+    {
+     "name": "pressClass",
+     "type": "String",
+     "desc": "A CSS class name to be applied to the element while pressed.",
+     "memberOf": ""
+    },
+    {
+     "name": "accelerate",
+     "type": "Boolean",
+     "desc": "True if autorepeating should start slowly and accelerate.\n          \"interval\" and \"delay\" are ignored. \"immediate\" is honored.",
+     "memberOf": ""
+    },
+    {
+     "name": "preventDefault",
+     "type": "Boolean",
+     "desc": "True to prevent the default click event",
+     "memberOf": ""
+    },
+    {
+     "name": "stopDefault",
+     "type": "Boolean",
+     "desc": "True to stop the default click event",
+     "memberOf": ""
+    },
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "click",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires on a specified interval during the time the element is pressed."
+    },
+    {
+     "name": "mousedown",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse button is depressed."
+    },
+    {
+     "name": "mouseup",
+     "sig": "function (_self)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the mouse key is released."
+    }
+   ]
+  },
+  "Roo.util.DelayedTask": {
+   "props": [],
+   "events": []
+  },
+  "Roo.util.Format": {
+   "props": [],
+   "events": []
+  },
+  "Roo.util.JSON": {
+   "props": [],
+   "events": []
+  },
+  "Roo.util.MixedCollection": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": "Roo.util.Observable"
+    }
+   ],
+   "events": [
+    {
+     "name": "add",
+     "sig": "function (index, o, key)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an item is added to the collection."
+    },
+    {
+     "name": "clear",
+     "sig": "function ()\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when the collection is cleared."
+    },
+    {
+     "name": "remove",
+     "sig": "function (o, key)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an item is removed from the collection."
+    },
+    {
+     "name": "replace",
+     "sig": "function (key, old, new)\n{\n\n}",
+     "type": "function",
+     "desc": "Fires when an item is replaced in the collection."
+    }
+   ]
+  },
+  "Roo.util.Observable": {
+   "props": [
+    {
+     "name": "listeners",
+     "type": "Object",
+     "desc": "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+     "memberOf": ""
+    }
+   ],
+   "events": []
+  },
+  "Roo.util.TextMetrics": {
+   "props": [],
+   "events": []
+  },
+  "Roo.util.TextMetrics.Instance": {
+   "props": [],
+   "events": []
+  },
+  "String": {
+   "props": [],
+   "events": []
+  },
+  "this": {
+   "props": [],
+   "events": []
+  }
+ }
+}
\ No newline at end of file

diff --git a/Builder/RooProjectProperties.js b/Builder/RooProjectProperties.js
new file mode 100644 (file)
index 0000000..f4d2c83
--- /dev/null
+++ b/Builder/RooProjectProperties.js
@@ -0,0 +1,102 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+RooProjectProperties=new XObject({
+    xtype: Gtk.Dialog,
+    modal : true,
+    show : function() {
+        // get the active project.
+        var file = this.get('/Window.LeftTree').getActiveFile();
+        if (!file) {
+            this.get('/StandardErrorDialog').show("No file is currently active");
+            return;
+        }
+        var project = this.get('/Window.LeftTree').getActiveFile().project;
+        //print (project.fn);
+        project.runhtml = project.runhtml || '';
+        this.get('view').el.get_buffer().set_text(project.runhtml, project.runhtml.length);
+        
+        this.el.show_all();
+    },
+    default_width : 500,
+    listeners : {
+        delete_event : function (self, event) {
+            this.el.hide()
+            return true;
+        },
+        response : function (self, response_id) {
+           print(response_id);
+           if (!response_id) {
+              this.el.hide();
+            
+              return;
+           }
+           var buf =    this.get('view').el.get_buffer()
+           var s = new Gtk.TextIter();
+            var e = new Gtk.TextIter();
+            buf.get_start_iter(s);
+            buf.get_end_iter(e);
+            var str = buf.get_text(s,e,true);
+            // ideally we should syntax check it.. but it's html!?
+            
+           var project = this.get('/Window.LeftTree').getActiveFile().project;
+           
+           
+           project.runhtml = str;
+           
+           imports.Builder.Provider.ProjectManager.ProjectManager.saveConfig();
+        //   print (str);
+           //    this.get('view').el.get_buffer().get_text(project.runjs, project.runjs.length);
+           // ok pressed..
+           this.el.hide();
+        }
+    },
+    items : [
+        {
+            xtype: Gtk.VBox,
+            pack : function(p,e) {
+                        p.el.get_content_area().add(e.el);
+                        e.border_width  =5;
+                    },
+            items : [
+                {
+                    xtype: Gtk.Label,
+                    pack : "pack_start,false,false,0",
+                    label : "HTML To insert at end of <HEAD>"
+                },
+                {
+                    xtype: Gtk.ScrolledWindow,
+                    pack : "pack_end,true,true,0",
+                    items : [
+                        {
+                            xtype: GtkSource.View,
+                            pack : "add",
+                            id : "view"
+                        }
+                    ]
+                }
+            ]
+        },
+        {
+            xtype: Gtk.Button,
+            pack : "add_action_widget,1",
+            label : "OK"
+        },
+        {
+            xtype: Gtk.Button,
+            pack : "add_action_widget,0",
+            label : "Cancel"
+        }
+    ]
+});
+RooProjectProperties.init();
+XObject.cache['/RooProjectProperties'] = RooProjectProperties;

diff --git a/Builder/StandardErrorDialog.js b/Builder/StandardErrorDialog.js
new file mode 100644 (file)
index 0000000..53acf09
--- /dev/null
+++ b/Builder/StandardErrorDialog.js
@@ -0,0 +1,38 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+StandardErrorDialog=new XObject({
+    xtype: Gtk.MessageDialog,
+    buttons : Gtk.ButtonsType.OK,
+    modal : true,
+    message_type : Gtk.MessageType.ERROR,
+    text : "fixme",
+    use_markup : true,
+    show : function(msg) {
+         if (!this.el) {
+                this.init();
+            }
+            this.el.text =  msg;
+            this.el.show_all();
+    },
+    listeners : {
+        delete_event : function (self, event) {
+            this.el.hide();
+            return true;
+        },
+        response : function (self, response_id) {
+           this.el.hide();
+        }
+    }
+});
+StandardErrorDialog.init();
+XObject.cache['/StandardErrorDialog'] = StandardErrorDialog;

diff --git a/Builder/Window.bjs b/Builder/Window.bjs
new file mode 100644 (file)
index 0000000..06ae52d
--- /dev/null
+++ b/Builder/Window.bjs
@@ -0,0 +1,1175 @@
+{
+    "id": "file-gtk-1",
+    "name": "Window",
+    "parent": "",
+    "title": false,
+    "path": "/home/alan/gitlive/app.Builder.js/Sample/Window.bjs",
+    "items": [
+        {
+            "listeners": {
+                "delete_event": "function (self, event) {\n    return false;\n}",
+                "destroy": "function (self) {\n   Gtk.main_quit();\n}",
+                "show": "function (self) {\n  print(\"WINDOW SHOWING - trying to hide\");\nimports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();\n \tthis.get('/MidPropTree').hideWin();\n    this.get('/RightPalete').hide();\n    this.get('/BottomPane').el.hide();\n    //this.get('/Editor').el.show_all();\n\n}"
+            },
+            "border_width": 0,
+            "default_height": 500,
+            "default_width": 800,
+            "id": "Window",
+            "title": "Application Builder",
+            "xtype": "Window",
+            "|init": "function() {\n     this.atoms = {\n           \"STRING\" : Gdk.atom_intern(\"STRING\")\n\t};\n\tthis.targetList = new Gtk.TargetList();\n\tthis.targetList.add( this.atoms[\"STRING\"], 0, 0);\n\t//imports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();\nGtk.rc_parse_string(\n            \"style \\\"gtkcombobox-style\\\" {\\n\" + \n            \"    GtkComboBox::appears-as-list = 1\\n\" +\n            \"}\\n\"+\n            \"class \\\"GtkComboBox\\\" style \\\"gtkcombobox-style\\\"\\n\");\n    XObject.prototype.init.call(this);\n    this.el.show_all();\n    \n   \n              \n}\n",
+            "|setTitle": "function(str) {\n    this.el.set_title(this.title + ' - ' + str);\n}\n",
+            "|type": "Gtk.WindowType.TOPLEVEL",
+            "|xns": "Gtk",
+            "items": [
+                {
+                    "|xns": "Gtk",
+                    "xtype": "VBox",
+                    "id": "w-vbox",
+                    "items": [
+                        {
+                            "|xns": "Gtk",
+                            "xtype": "MenuBar",
+                            "pack": "pack_start,false,false",
+                            "items": [
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "MenuItem",
+                                    "|use_underline": true,
+                                    "label": "_File",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "label": "New _Project",
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n         var _this = this;\n\tthis.get('/EditProject').show({\n\t    success : function(pr) {\n\t\t     _this.get('/LeftProjectTree').get('combo').setValue(pr.fn);\n\t    }\n\t});\n}"
+                                                    }
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "label": "_New File",
+                                                    "|use_underline": true,
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n \tvar fn = this.get('/LeftProjectTree.combo').getValue();\n        if (!fn) {\n            this.get('/LeftProjectTree').showNoProjectSelected();\n            return true;\n        }\n        var pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n        this.get('/DialogNewComponent').show({\n            project : pm.getByFn(fn)\n        });\n}"
+                                                    }
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "SeparatorMenuItem",
+                                                    "pack": "add"
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "pack": "add",
+                                                    "label": "D_elete Project",
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n\n\tvar fn =  this.get('/LeftProjectTree').get('combo').getValue();\n\tif (!fn.length) {\n\t\tthis.get('/StandardErrorDialog').show(\"Select a project\")\n\t\treturn;\n        }\n\tvar pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n\tvar pr  = pm.getByFn(fn);\n\n\t// confirm..\n\tthis.get('/DialogConfirm').show(\"Are you sure you want to delete project '\" + pr.name + \"'\", function() {\n\t\tpm.deleteProject(fn);\n\t\tprint(\"DELETE?\");\n\t});\n\n}"
+                                                    }
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "SeparatorMenuItem",
+                                                    "pack": "add"
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "pack": "add",
+                                                    "label": "_Quit",
+                                                    "|use_underline": true,
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n   Gtk.main_quit();\n} "
+                                                    }
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "label": "_Edit",
+                                    "xtype": "MenuItem",
+                                    "|use_underline": true,
+                                    "|xns": "Gtk",
+                                    "pack": "add",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "listeners": {},
+                                            "items": [
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n \tvar fn = this.get('/LeftTree').getActiveFile();\n        if (!fn) {\n            this.get('/StandardErrorDialog').show(\"No File active\");\n            return true;\n        }\n \n        this.get('/DialogNewComponent').show(fn);\n        return true;\n}"
+                                                    },
+                                                    "label": "File _Properties",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                },
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self, event) {\n    this.get('/RooProjectProperties').show();\n    return false;\n}"
+                                                    },
+                                                    "label": "Modify Project HTML ",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "label": "_View",
+                                    "xtype": "MenuItem",
+                                    "|use_underline": true,
+                                    "|xns": "Gtk",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "listeners": {},
+                                            "items": [
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self, event) {\n      var js = this.get('/LeftTree.model').toJS();\n    if (js && js[0]) {\n        this.get('/RightBrowser.view').renderJS(js[0], true);\n    } \n    return false;\n}"
+                                                    },
+                                                    "label": "_Redraw (Roo)",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                },
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self, event) \n{\n        /* Firefox testing for debugging..\n          - we can create a /tmp directory, and put.\n            builder.html, builder.html.js, link roojs1 \n            add at the end of builder.html Roo.onload(function() {\n\t  */\n\t if (!this.get('/Window.LeftTree').getActiveFile()) {\n            return;\n        }\n        \n        var js = this.get('/LeftTree.model').toJS();\n         if (!js ||  !js[0]) {\n            return;\n        }\n        var project = this.get('/Window.LeftTree').getActiveFile().project;\n        //print (project.fn);\n        \n        project.runhtml  = project.runhtml || '';\n\n\n\tvar File = imports.File.File;\n\t\n\tvar target = \"/tmp/firetest\"; // fixme..\n\tif (!File.isDirectory(target)) {\n\t    File.mkdir(target);\n        }\n\tFile.copy(__script_path__ + '/../builder.html.js', target+ '/builder.html.js', Gio.FileCopyFlags.OVERWRITE);\n\tif (!File.exists( target+ '/roojs1')) {\n            File.link( target+ '/roojs1', __script_path__ + '/../roojs1');\n    \t}\n        \n        \n        \n        var html = imports.File.File.read(__script_path__ + '/../builder.html');\n        html = html.replace('</head>', project.runhtml + '</head>');\n        \n       \n        var     jsstr = JSON.stringify(js[0], null, 4);\n       \n        var runbuilder = '<script type=\"text/javascript\">' + \"\\n\" + \n            \" Builder.render(\" + jsstr + \");\\n\" +\n            '</script>';\n        \n        html = html.replace('</body>', runbuilder + '</body>');\n\n\tFile.write( target+ '/builder.html', html);\n\t\n        this.get('/Terminal').feed(\"RUN DIR:\" + target);\n    \n    this.get('/Terminal').el.fork_command( null , [], [], target\n\t, false,false,false); \n    var cmd = \"firefox file://\" + target + \"/builder.html  \\n\";\n    this.get('/Terminal').el.feed_child(cmd, cmd.length);\n     return false;\n}"
+                                                    },
+                                                    "label": "_Test in Firefox (Roo)",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "MenuItem",
+                                    "label": "_Help",
+                                    "|use_underline": true,
+                                    "listeners": {},
+                                    "pack": "add",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "listeners": {},
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "pack": "add",
+                                                    "label": "_About",
+                                                    "|use_underline": true,
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n    this.get('/About').el.run();\n}"
+                                                    }
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            "|xns": "Gtk",
+                            "xtype": "HPaned",
+                            "id": "left",
+                            "position": 400,
+                            "items": [
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "HBox",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "VPaned",
+                                            "position": 300,
+                                            "id": "leftvpaned",
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "id": "LeftTopPanel",
+                                                    "items": [
+                                                        {
+                                                            "listeners": {
+                                                                "activate": "function (self) {\n    // this does not actually expand it..\n    // that is done by GTK..\n    \n    \n\n    if (!this.el.expanded) {\n        this.onExpand();\n    } else {\n        this.onCollapse();\n    }\n\t  \n}",
+                                                                "enter_notify_event": "function (self, event) {\nreturn;\n     this.el.expanded = !this.el.expanded;\n//if (this.el.expanded ) {\n    this.listeners.activate.call(this);\n//   }\n\nreturn true;\n}"
+                                                            },
+                                                            "id": "expander",
+                                                            "label": "Select Project or File",
+                                                            "pack": "pack_start,false,true",
+                                                            "xtype": "Expander",
+                                                            "|onCollapse": "function() {\n    \n    var nb = this.get('/LeftTopPanel.notebook');\n    nb.el.set_current_page(0);\n}\n",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.add_events (Gdk.EventMask.BUTTON_MOTION_MASK );\n}\n",
+                                                            "|onExpand": "function() {\n    var nb = this.get('/LeftTopPanel.notebook');            \n    var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;\n    \n   \n    var model = this.get('/LeftProjectTree.combomodel');\n    //  print (\"loading Projects?\")\n    //console.dump(pm.projects);\n    model.loadData(pm.projects);\n     \n    \n    nb.el.set_current_page(1);\n    //pm.on('changed', function() {\n\t//console.log(\"CAUGHT project manager change\");\n    //    _combo.model.loadData(pm.projects);\n    //}\n    return;\n}\n",
+                                                            "|xns": "Gtk"
+                                                        },
+                                                        {
+                                                            "id": "notebook",
+                                                            "pack": "pack_start,true,true",
+                                                            "xtype": "Notebook",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.set_current_page(0);\n\n}\n",
+                                                            "|show_border": false,
+                                                            "|show_tabs": false,
+                                                            "|xns": "Gtk",
+                                                            "items": [
+                                                                {
+                                                                    "id": "LeftTree",
+                                                                    "pack": "add",
+                                                                    "xtype": "ScrolledWindow",
+                                                                    "|getActiveElement": "function() { // return path to actie node.\n\n     var path = this.getActivePath();\n     if (!path) {\n        return false;\n     }\n     var iter = new Gtk.TreeIter();\n     this.get('model').el.get_iter_from_string(iter, path);\n     \n     var value = new GObject.Value('');\n     this.get('model').el.get_value(iter, 2, value);\n        \n     return JSON.parse(value.value);\n}\n",
+                                                                    "|getActiveFile": "function() {\n    return this.get('model').file;\n}\n",
+                                                                    "|getActivePath": "function() {\n    var model = this.get('model');\n    var view = this.get('view');\n    if (view.selection.count_selected_rows() < 1) {\n        return false;\n    }\n    var iter = new Gtk.TreeIter();\n\n    view.selection.get_selected(model.el, iter);\n    return model.el.get_path(iter).to_string();\n}\n",
+                                                                    "|getPaleteProvider": "function() {\n    var model = this.get('model');\n    var pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n    return pm.getPalete(model.file.getType());\n}\n",
+                                                                    "|getRenderer": "function() {\n\n\tswitch( this.getActiveFile().getType()) {\n\t\tcase 'Roo':\n\t\t    return this.get('/RightBrowser.view');\n\t\tcase 'Gtk':\n\t\t    return this.get('/RightGtkView');\n\t}\n\n}\n",
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)\n}\n",
+                                                                    "|renderView": "function() {\n    var render = this.getRenderer();\n    var model = this.get('model');\n    if (render) {\n        render.renderJS(model.toJS(false,true)[0]);\n    } else {\n        print(\"NO RENDER JS METHOD?\");\n    }\n}\n",
+                                                                    "|shadow_type": "Gtk.ShadowType.IN",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "listeners": {
+                                                                                "button_press_event": "function (self, ev) {\n \tconsole.log(\"button press?\");\n        if (ev.type != Gdk.EventType.BUTTON_PRESS  || ev.button.button != 3) {\n            print(\"click\" + ev.type);\n            return false;\n        }\n      \n    \n        var res = {}; \n        this.get('/LeftTree.view').el.get_path_at_pos(ev.button.x,ev.button.y, res);\n        \n        if (!this.get('/LeftTreeMenu').el)  this.get('/LeftTreeMenu').init();\n        \n        this.get('/LeftTreeMenu').el.set_screen(Gdk.Screen.get_default());\n        this.get('/LeftTreeMenu').el.show_all();\n        this.get('/LeftTreeMenu').el.popup(null, null, null, null, 3, ev.button.time);\n        print(\"click:\" + res.path.to_string());\n        return false;\n}",
+                                                                                "drag_begin": "function (self, drag_context) {\n\tprint('SOURCE: drag-begin');\n         this.targetData = false;\n        // find what is selected in our tree...\n        var iter = new Gtk.TreeIter();\n        var s = this.selection;\n        s.get_selected(this.get('/LeftTree.model').el, iter);\n\n        // set some properties of the tree for use by the dropped element.\n        var value = new GObject.Value('');\n        this.get('/LeftTree.model').el.get_value(iter, 2, value);\n        var data = JSON.parse(value.value);\n        var xname = this.get('/LeftTree.model').file.guessName(data);\n        \n        this.el.dragData = xname;\n        this.el.dropList = this.get('/LeftTree').getPaleteProvider().getDropList(xname);\n        \n\n        // make the drag icon a picture of the node that was selected\n        var path = this.get('/LeftTree.model').el.get_path(iter);\n        this.el.treepath = path.to_string();\n        \n        var pix = this.el.create_row_drag_icon ( path);\n        \n        Gtk.drag_set_icon_pixmap (ctx,\n            pix.get_colormap(),\n            pix,\n            null,\n            -10,\n            -10);\n        \n        return true;\n}",
+                                                                                "drag_end": "function (self, drag_context) {\n\tSeed.print('LEFT-TREE: drag-end');\n        this.el.dragData = false;\n        this.el.dropList = false;\n        this.targetData = false;\n        this.get('/LeftTree.view').highlight(false);\n        return true;\n}",
+                                                                                "drag_motion": "function (self, ctx, x, y, time) {\n    console.log(\"LEFT-TREE: drag-motion\");\n                var src = Gtk.drag_get_source_widget(ctx);\n\n                // a drag from  elsewhere...- prevent drop..\n                if (!src.dragData) {\n                    print(\"no drag data!\");\n                    Gdk.drag_status(ctx, 0, time);\n                    this.targetData = false;\n                    return true;\n                }\n                var action = Gdk.DragAction.COPY;\n                if (src == this.el) {\n                    // unless we are copying!!! ctl button..\n                    action = ctx.actions & Gdk.DragAction.MOVE ? Gdk.DragAction.MOVE : Gdk.DragAction.COPY ;\n                }\n                var data = {};\n\n\t\tif (!this.get('/LeftTree.model').el.iter_n_children(null)) {\n\t\t\t// no children.. -- asume it's ok..\n\t\t\tthis.targetData =  [ '' , Gtk.TreeViewDropPosition.INTO_OR_AFTER , ''];\n\t\t\tGdk.drag_status(ctx, action ,time);\n\t\t\treturn true;\n\t\t}\n\n                print(\"GETTING POS\");\n                var isOver = this.get('/LeftTree.view').el.get_dest_row_at_pos(x,y, data);\n                print(\"ISOVER? \" + isOver);\n                if (!isOver) {\n                    Gdk.drag_status(ctx, 0 ,time);\n                    return false; // not over apoint!?!\n                }\n                // drag node is parent of child..\n                console.log(\"SRC TREEPATH: \" + src.treepath);\n                console.log(\"TARGET TREEPATH: \" + data.path.to_string());\n                \n                // nned to check a  few here..\n                //Gtk.TreeViewDropPosition.INTO_OR_AFTER\n                //Gtk.TreeViewDropPosition.INTO_OR_BEFORE\n                //Gtk.TreeViewDropPosition.AFTER\n                //Gtk.TreeViewDropPosition.BEFORE\n                \n                if (typeof(src.treepath) != 'undefined'  && \n                    src.treepath == data.path.to_string().substring(0,src.treepath.length)) {\n                    print(\"subpath drag\");\n                     Gdk.drag_status(ctx, 0 ,time);\n                    return false;\n                }\n                \n                // check that \n                //print(\"DUMPING DATA\");\n                //console.dump(data);\n                // path, pos\n                \n                print(data.path.to_string() +' => '+  data.pos);\n                var tg = this.get('/LeftTree.model').findDropNodeByPath(\n                    data.path.to_string(), src.dropList, data.pos);\n                    \n                this.get('/LeftTree.view').highlight(tg);\n                if (!tg.length) {\n                    print(\"Can not find drop node path\");\n                    this.targetData = false;\n                    Gdk.drag_status(ctx, 0, time);\n                    return true;\n                }\n                //console.dump(tg);\n                this.targetData = tg;    \n                \n                \n                Gdk.drag_status(ctx, action ,time);\n                 \n                return true;\n}",
+                                                                                "drag_drop": "function (w, ctx, x, y, time) {\n      Seed.print(\"TARGET: drag-drop\");\n                       \n                        Gtk.drag_get_data\n                        (\n                                w,         /* will receive 'drag-data-received' signal */\n                                ctx,        /* represents the current state of the DnD */\n                                this.get('/Window').atoms[\"STRING\"],    /* the target type we want */\n                                time            /* time stamp */\n                        );\n                        \n                         \n                        /* No target offered by source => error */\n                       \n\n                        return  true;\n}",
+                                                                                "drag_data_received": "function (self, ctx, x, y, sel_data, info, time) {\n\t print(\"Tree: drag-data-received\");\n\n              var   delete_selection_data = false;\n               var  dnd_success = false;\n                /* Deal with what we are given from source */\n                if( sel_data && sel_data.length ) {\n                    \n                    if (ctx.action == Gdk.DragAction.ASK)  {\n                        /* Ask the user to move or copy, then set the ctx action. */\n                    }\n\n                    if (ctx.action == Gdk.DragAction.MOVE) {\n                        //delete_selection_data = true;\n                    }\n                    \n                    var source = Gtk.drag_get_source_widget(ctx);\n\n                    if (this.targetData) {\n                        if (source != this.el) {\n                            this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);\n                        } else {\n                            // drag around.. - reorder..\n                             this.get('/LeftTree.model').moveNode(this.targetData, ctx.action);\n                            \n                            \n                        }\n                        //Seed.print(this.targetData);\n                      \n                    }\n                    \n                    \n                    \n                    // we can send stuff to souce here...\n\n                    dnd_success = true;\n\n                }\n\n                if (dnd_success == false)\n                {\n                        Seed.print (\"DnD data transfer failed!\\n\");\n                }\n\n                Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);\n                return true;\n}",
+                                                                                "cursor_changed": "function (self) {\n     if (this.blockChanges) { // probably not needed.. \n       return true;\n     }\n     var render = this.get('/LeftTree').getRenderer();                \n   \n    \n    if (this.selection.count_selected_rows() < 1) {\n        this.get('/LeftPanel.model').load( false);\n        this.get('/MidPropTree').activeElement =  false;\n        this.get('/MidPropTree').hideWin();\n\n        var pm = this.get('/RightPalete.model');\n        if (!this.get('/LeftTree').getPaleteProvider()) {\n            // it may not be loaded yet..\n            return  true;\n        }\n        pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(\n            this.get('/LeftTree.model').listAllTypes()));\n        if (render && render.redraw) {\n            render.redraw();\n        }\n        return true;\n    }\n            \n            //console.log('changed');\n        var s = this.selection;\n          var iter = new Gtk.TreeIter();\n        s.get_selected(this.get('/LeftTree.model').el, iter);\n        \n        \n        // var val = \"\";\n        var value = new GObject.Value('');\n        this.get('/LeftTree.model').el.get_value(iter, 2, value);\n        this.get('/LeftTree.model').activePath = this.get('/LeftTree.model').el.get_path(iter).to_string();\n        \n        var data = JSON.parse(value.value);\n        this.get('/MidPropTree').activeElement =  data;\n        this.get('/MidPropTree').hideWin();\n        this.get('/LeftPanel.model').load( data);\n        \n        console.log(value.value);\n       // _g.button.set_label(''+value.get_string());\n\n        var pm =this.get('/RightPalete.model');\n        pm.load(  this.get('/LeftTree').getPaleteProvider().gatherList(\n             this.get('/LeftTree.model').listAllTypes()));\n       \n        \n           if (render && render.redraw) {\n            render.redraw();\n        }\n           \n            //Seed.print( value.get_string());\n            return true;\n                \n}"
+                                                                            },
+                                                                            "id": "view",
+                                                                            "pack": "add",
+                                                                            "tooltip_column": 1,
+                                                                            "xtype": "TreeView",
+                                                                            "|enable_tree_lines": true,
+                                                                            "|headers_visible": false,
+                                                                            "|highlight": "function(treepath_ar) {\n\n        // highlighting for drag/drop\n        if (treepath_ar.length && treepath_ar[0].length ) {\n            this.el.set_drag_dest_row( \n                    new  Gtk.TreePath.from_string( treepath_ar[0] ),  treepath_ar[1]);\n            } else {\n                this.el.set_drag_dest_row(null, Gtk.TreeViewDropPosition.INTO_OR_AFTER);\n            }\n             \n        }",
+                                                                            "|init": "function() {\n    \tXObject.prototype.init.call(this);\n\tvar description = new Pango.FontDescription.c_new();\n\tdescription.set_size(8000);\n\tthis.el.modify_font(description);\n\n\tthis.selection = this.el.get_selection();\n\tthis.selection.set_mode( Gtk.SelectionMode.SINGLE);\n\tvar _this = this;\n\n\t// is this really needed??\n\tthis.selection.signal['changed'].connect(function() {\n\t\t_this.get('/LeftTree.view').listeners.cursor_changed.apply(\n\t\t    _this.get('/LeftTree.view'), [ _this.get('/LeftTree.view'), '']\n\t\t);\n\t});\n\n\tGtk.drag_source_set (\n\t\tthis.el,            /* widget will be drag-able */\n\t\tGdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */\n\t\tnull,            /* lists of target to support */\n\t\t0,              /* size of list */\n\t\tGdk.DragAction.COPY   | Gdk.DragAction.MOVE           /* what to do with data after dropped */\n\t);\n\n\tGtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);\n\n\tGtk.drag_source_add_text_targets(this.el); \n\tGtk.drag_dest_set\n\t(\n\t    this.el,              /* widget that will accept a drop */\n\t    Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,\n\t    null,            /* lists of target to support */\n\t    0,              /* size of list */\n\t    Gdk.DragAction.COPY   | Gdk.DragAction.MOVE       /* what to do with data after dropped */\n\t);\n\n\tGtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);\n\tGtk.drag_dest_add_text_targets(this.el);\n}\n",
+                                                                            "|selectNode": "function(treepath_str) {\n    //this.selection.select_path(new  Gtk.TreePath.from_string( treepath_str));\n var tp = new Gtk.TreePath.from_string(treepath_str);\n          this.el.set_cursor(tp, null, false);  \n      this.el.scroll_to_cell(tp, null, false, 0,0);\n}\n",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "activePath": false,
+                                                                                    "currentTree": false,
+                                                                                    "id": "model",
+                                                                                    "pack": "set_model",
+                                                                                    "xtype": "TreeStore",
+                                                                                    "|changed": "function(n, refresh) {\n    //     print(\"MODEL CHANGED CALLED\" + this.activePath);\n         if (this.activePath) {\n            var iter = new Gtk.TreeIter();\n            this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath))\n            this.el.set_value(iter, 0, [GObject.TYPE_STRING, this.nodeTitle(n)]);\n            this.el.set_value(iter, 1, [GObject.TYPE_STRING, this.nodeTitle(n)]);\n            \n            this.el.set_value(iter, 2, [GObject.TYPE_STRING, this.nodeToJSON(n)]);\n        }\n            //this.currentTree = this.toJS(false, true)[0];\n        var d = new Date();\n        this.file.items = this.toJS(false, false);\n        print (\"TO JS in \" + ((new Date()) - d) + \"ms\");\n      //  print(\"AFTER CHANGED\");\n        //console.dump(this.file.items);\n        this.file.save();\n        this.currentTree = this.file.items[0];\n        //console.log(this.file.toSource());\n        \n        if (refresh) {\n            print(\"REDNER BROWSER?!\");\n            this.get('/LeftTree').renderView();\n\n            var pm = this.get('/RightPalete.model');\n            if (!this.get('/RightPalete').provider) {\n                pm.load([]);\n                return;\n            }\n            \n            \n            pm.load( this.get('/RightPalete').provider.gatherList(this.listAllTypes()));\n            //imports['Builder/RightBrowser.js'].renderJS(this.toJS());\n        }\n\t          \n}\n",
+                                                                                    "|deleteSelected": "function() {\n    this.get('/LeftTree.view').blockChanges = true;\n    var old_iter = new Gtk.TreeIter();\n    var s = this.get('/LeftTree.view').selection;\n    s.get_selected(this.el, old_iter);\n    var path = this.el.get_path(old_iter).to_string();\n\n    this.activePath= false;      \n    s.unselect_all();\n\n    this.activePath= false;      \n     var iter = new Gtk.TreeIter();\n    this.el.get_iter_from_string(iter, path);\n    this.el.remove(iter);\n    \n    // rebuild treemap. -- depreciated.!!\n    this.map = {};\n    this.treemap = { };\n    //this.toJS(null, true) // does not do anything?\n    this.activePath= false;      \n    this.changed(false,true);\n    this.get('/LeftTree.view').blockChanges = false;\n}\n",
+                                                                                    "|dropNode": "function(target_data, node) {\n         print(\"drop Node\");\n     // console.dump(node);\n  //    console.dump(target_data);\n        var tp = target_data[0].length ? new  Gtk.TreePath.from_string( target_data[0] ) : false;\n        \n        print(\"add \" + tp + \"@\" + target_data[1]  );\n        var parent = tp;\n        var after = false;\n        if (tp && target_data[1]  < 2) { // before or after..\n            var ar = target_data[0].split(':');\n            ar.pop();\n            parent  = new  Gtk.TreePath.from_string( ar.join(':') );\n            after = tp;\n        }\n        var n_iter = new Gtk.TreeIter();\n        var iter_par = new Gtk.TreeIter();\n        var iter_after = after ? new Gtk.TreeIter() : false;\n        \n        \n        \n        if (parent !== false) {\n            this.el.get_iter(iter_par, parent);\n        } else {\n            iter_par = null;\n        }\n        \n        \n        if (tp && after) {\n            print(target_data[1]  > 0 ? 'insert_after' : 'insert_before');\n            this.el.get_iter(iter_after, after);\n            this.el[ target_data[1]  > 0 ? 'insert_after' : 'insert_before'](\n                    n_iter, iter_par, iter_after);\n            \n        } else {\n            this.el.append(n_iter, iter_par);\n            \n        }\n        \n        if (typeof(node) == 'string') {\n            var ar = node.split('.');\n            var xtype = ar.pop();\n            \n            node = {\n                '|xns' : ar.join('.'),\n                'xtype' : xtype\n            };\n            if (target_data.length == 3 && target_data[2].length) {\n                node['*prop'] = target_data[2];\n            }\n            node = this.get('/DialogTemplateSelect').show(node);\n            \n        }\n        // work out what kind of packing to use..\n        if (typeof(node.pack) == 'undefined'  && parent !== false) {\n            var pal = this.get('/LeftTree').getPaleteProvider();\n            if (pal.name == 'Gtk') {\n                var pname = pal.guessName(this.singleNodeToJS(parent.to_string()));\n                var cname = pal.guessName(node);\n                node.pack = pal.getDefaultPack(pname, cname);\n            }\n            \n        }\n        \n        \n        var xitems = [];\n        if (node.items) {\n            xitems = node.items;\n            delete node.items;\n        }\n// load children - if it has any..\n\n        if (xitems) {\n            this.load(xitems, n_iter);\n            this.get('/LeftTree.view').el.expand_row(this.el.get_path(n_iter), true);\n        }\n        if (tp && (xitems || after)) {\n            this.get('/LeftTree.view').el.expand_row(this.el.get_path(iter_par), true);\n        }\n        // wee need to get the empty proptypes from somewhere..\n        \n        //var olditer = this.activeIter;\n        this.activePath = this.el.get_path(n_iter).to_string();\n\n  // changed actually set's the node data..\n        this.changed(node, true);\n        \n        \n        \n        this.get('/LeftTree.view').el.set_cursor(this.el.get_path(n_iter), null, false);\n        \n        //Builder.MidPropTree._model.load(node);\n        //Builder.MidPropTree._win.hideWin();\n        //Builder.LeftPanel._model.load( node);\n        \n            \n}\n",
+                                                                                    "|findDropNode": "function(treepath_str, targets) {\n\n// this is used by the dragdrop code in the roo version AFAIR..\n\n    \t\tvar path = treepath_str.replace(/^builder-/, '');\n            // treemap is depreciated... - should really check if model has any entries..\n\n            if (!this.el.iter_n_children(null)) {\n                print(\"NO KEYS\");\n                return [ '',  Gtk.TreeViewDropPosition.INTO_OR_AFTER];\n            }\n            print(\"FIND treepath: \" + path);\n            //console.dump(this.treemap);\n            \n            if (!treepath_str.match(/^builder-/)) {\n                return []; // nothing!\n            }\n            if (targets === true) {\n                return [ path ];\n            }\n            return this.findDropNodeByPath(path,targets) \n}\n",
+                                                                                    "|findDropNodeByPath": "function(treepath_str, targets, pref) {\n    var path = treepath_str + ''; // dupe it..\n    pref = typeof(pref) == 'undefined' ?  Gtk.TreeViewDropPosition.INTO_OR_AFTER : pref;\n    var last = false;\n    //console.dump(this.treemap);\n    while (path.length) {\n        print(\"LOOKING FOR PATH: \" + path);\n        var node_data = this.singleNodeToJS(path);\n        if (node_data === false) {\n            print(\"node not found\");\n            return [];\n        }\n        \n        var xname = this.get('/LeftTree.model').file.guessName(node_data);\n        var match = false;\n        var prop = '';\n        targets.forEach(function(tg) {\n            if (match) {\n                return;;\n            }\n            if ((tg == xname)  ) {\n                match = tg;\n            }\n            if (tg.indexOf(xname +':') === 0) {\n                match = tg;\n                prop = tg.split(':').pop();\n            }\n        });\n        \n        if (match) {\n            if (last) { // pref is after/before..\n                // then it's after last\n                if (pref > 1) {\n                    return []; // do not allow..\n                }\n                return [ last, pref , prop];\n                \n            }\n            return [ path , Gtk.TreeViewDropPosition.INTO_OR_AFTER , prop];\n        }\n        var par = path.split(':');\n        last = path;\n        par.pop();\n        path = par.join(':');\n    }\n    \n    return [];\n            \n}\n",
+                                                                                    "|getIterValue": " function (iter, col) {\n    var gval = new GObject.Value('');\n    this.el.get_value(iter, col ,gval);\n    return  gval.value;\n    \n    \n}",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n this.el.set_column_types ( 3, [\n            GObject.TYPE_STRING, // title \n            GObject.TYPE_STRING, // tip\n            GObject.TYPE_STRING // source..\n            ] );\n}\n",
+                                                                                    "|listAllTypes": "function() {\n    var s = this.get('/LeftTree.view').selection;\n    print (\"LIST ALL TYPES: \" + s.count_selected_rows() );\n    \n    if (s.count_selected_rows() > 0) {\n        var iter = new Gtk.TreeIter();    \n        s.get_selected(this.el, iter);\n\n        // set some properties of the tree for use by the dropped element.\n        var value = new GObject.Value('');\n        this.el.get_value(iter, 2, value);\n        var data = JSON.parse(value.value);\n        \n        \n        var xname = this.get('/LeftTree.model').file.guessName(data);\n        console.log('selected:' + xname);\n        if (xname.length) {\n            return [ xname ];\n        }\n        return []; // could not find it..\n    }\n    \n    var ret = [ ];\n    \n   var _this = this;\n    function addall(li)\n    {\n        li.forEach(function(el) {\n            // this is specific to roo!!!?\n            if (!el) { // skip empty?\n                return;\n            }\n            var fullpath =  _this.file.guessName(el);\n            if (fullpath.length && ret.indexOf(fullpath) < 0) {\n                ret.push(fullpath);\n            }\n            \n            \n            if (el.items && el.items.length) {\n                addall(el.items);\n            }\n            \n        });\n        \n        \n    }\n    \n    addall([this.currentTree]);\n    \n    // only if we have nothing, should we add '*top'\n    if (!ret.length) {\n        ret = [ '*top' ];\n    }\n    //console.log('all types in tree');\n    //console.dump(ret);\n    \n    return ret;\n                            \n}\n",
+                                                                                    "|load": "function(tr,iter)\n        {\n            var citer = new Gtk.TreeIter();\n            //this.insert(citer,iter,0);\n            for(var i =0 ; i < tr.length; i++) {\n                if (iter) {\n                    this.el.insert(citer,iter,-1);\n                } else {\n                    this.el.append(citer);\n                }\n                \n                this.el.set_value(citer, 0, [GObject.TYPE_STRING, this.nodeTitle(tr[i]) ]);\n                this.el.set_value(citer, 1, [GObject.TYPE_STRING, this.nodeTip(tr[i]) ]);\n                this.el.set_value(citer, 2, [GObject.TYPE_STRING, this.nodeToJSON(tr[i])]);\n                if (tr[i].items && tr[i].items.length) {\n                    this.load(tr[i].items, citer);\n                }\n            }     \n        }",
+                                                                                    "|loadFile": "function(f) {\n    //console.dump(f);\n            this.el.clear();\n            this.file = f;\n            \n            if (!f) {\n                console.log('missing file');\n                return;\n            }\n            \n            // load the file if not loaded..\n            if (f.items === false) {\n                var _this = this;\n                f.loadItems(function() {\n                    _this.loadFile(f);\n                });\n                return;\n                \n            }\n            this.get('/Window').setTitle(f.project.getName() + ' - ' + f.name);\n            \n            if (f.items.length && typeof(f.items[0]) == 'string') {\n            \n                //this.get('/RightEditor').el.show();\n                //this.get('/RightEditor.view').load( f.items[0]);\n                return;\n            }\n            print(\"LOAD\");\n            print(JSON.stringify(f.items, null,4));\n            //console.dump(f.items);\n            this.load(f.items);\n            this.get('/LeftTree.view').el.expand_all();\n\n            if (!f.items.length) {\n                // single item..\n                \n                this.get('/Window.leftvpaned').el.set_position(80);\n                // select first...\n                this.get('/LeftTree.view').el.set_cursor( \n                    new  Gtk.TreePath.from_string('0'), null, false);\n                \n                \n            } else {\n                  this.get('/Window.leftvpaned').el.set_position(200);\n            }\n            \n            \n            //print(\"hide right editior\");\n            //this.get('/RightEditor').el.hide();\n            this.get('/Editor').el.hide();\n            //print(\"set current tree\");\n            this.currentTree = this.toJS(false, false)[0];\n            //console.dump(this.currentTree);\n            this.currentTree = this.currentTree || { items: [] };\n            this.get('/LeftTree').renderView();\n            //console.dump(this.map);\n            //var RightPalete     = imports.Builder.RightPalete.RightPalete;\n            var pm = this.get('/RightPalete.model');\n            // set up provider..\n            \n            this.get('/RightPalete').provider = this.get('/LeftTree').getPaleteProvider();\n            \n            if (!this.get('/RightPalete').provider) {\n                print (\"********* PALETE PROVIDER MISSING?!!\");\n            }\n            this.get('/LeftTree').renderView();\n            \n            pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(this.listAllTypes()));\n            \n            \n                    \n            this.get('/Window.view-notebook').el.set_current_page(\n                this.get('/LeftTree.model').file.getType()== 'Roo' ? 0 : -1);\n                    \n}\n",
+                                                                                    "|moveNode": "function(target_data, action) {\n     //print(\"MOVE NODE\");\n           // console.dump(target_data);\n            var old_iter = new Gtk.TreeIter();\n            var s = this.get('/LeftTree.view').selection;\n            s.get_selected(this.el, old_iter);\n            var node = this.nodeToJS(old_iter,false);\n            //console.dump(node);\n            \n            \n            // needs to drop first, otherwise the target_data \n            // treepath will be invalid.\n            \n            this.dropNode(target_data, node);\n\t  if (action & Gdk.DragAction.MOVE) {\n                      //          print(\"REMOVING OLD NODE\");\n                                this.el.remove(old_iter);\n                                \n            }\n            \n            this.activePath= false;\n            this.changed(false,true);\n}\n",
+                                                                                    "|nodeTip": "function(c) {\n    var ret = this.nodeTitle(c,true);\n    var funcs = '';\n\n    \n    for( var i in c) {\n\n        if (!i.length || i[0] != '|') {\n            continue;\n        }\n        if (i == '|init') { \n            continue;\n        }\n        if (typeof(c[i]) != 'string') {\n           continue;\n        }\n        //print(\"prop : \" + i + ':' + c[i]);\n        if (!c[i].match(new RegExp('function'))) {\n            continue;\n        }\n        funcs += \"\\n<b>\" + i.substring(1) + '</b> : ' + c[i].split(/\\n/).shift();\n            \n    }\n    if (funcs.length) {\n        ret+=\"\\n\\nMethods:\" + funcs;\n    }\n    return ret;\n    \n}\n",
+                                                                                    "|nodeTitle": "function(c, renderfull) {\n      var txt = [];\n    c = c || {};\n    var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;\n    if (sr) txt.push('<s>');\n    if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }\n    \n    if (renderfull && c['|xns']) {\n        txt.push(c['|xns']);\n    }\n    \n    if (c.xtype)      { txt.push(c.xtype); }\n    if (c.id)      { txt.push('<b>[id=' + c.id + ']</b>'); }\n    if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }\n    if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }\n    \n    \n    if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }\n    if (c.title)      { txt.push('<b>' + c.title + '</b>'); }\n    if (c.label)      { txt.push('<b>' + c.label+ '</b>'); }\n    if (c.header)    { txt.push('<b>' + c.header + '</b>'); }\n    if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }\n    if (c.text)       { txt.push('<b>' + c.text + '</b>'); }\n    if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }\n    if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }\n    if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }\n    \n    // for flat classes...\n    if (typeof(c['*class']) != 'undefined')  { txt.push('<b>' +  c['*class']+  '</b>'); }\n    if (typeof(c['*extends']) != 'undefined')  { txt.push(': <i>' +  c['*extends']+  '</i>'); }\n    \n    \n    if (sr) txt.push('</s>');\n    return (txt.length == 0 ? \"Element\" : txt.join(\" \"));\n}\n",
+                                                                                    "|nodeToJS": "function (treepath, with_id) \n{\n    \n    var iter = treepath;  // API used to be iter here..\n    if (typeof(iter) == 'string') {\n        iter = new Gtk.TreeIter(); \n        if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {\n            return false;\n        }\n    } \n    var par = new Gtk.TreeIter(); \n    var iv = this.getIterValue(iter, 2);\n   // print(\"IV\" + iv);\n    var k = JSON.parse(iv);\n    if (k.json && !this.el.iter_parent( par, iter  )) {\n        delete k.json;\n    }\n    \n    if (with_id) {\n        var treepath_str = this.el.get_path(iter).to_string();\n        // not sure how we can handle mixed id stuff..\n        if (typeof(k.id) == 'undefined')  {\n            k.id =  'builder-'+ treepath_str ;\n        }\n        \n        // needed??\n        this.treemap[  treepath_str ] = k;\n        k.xtreepath = treepath_str ;\n        \n    }\n    if (this.el.iter_has_child(iter)) {\n        citer = new Gtk.TreeIter();\n        this.el.iter_children(citer, iter);\n        k.items = this.toJS(citer,with_id);\n    }\n    return k;\n}\n",
+                                                                                    "|nodeToJSON": "function(c) {\n    var o  = {}\n    for (var i in c) {\n        if (i == 'items') {\n             continue;\n        }\n        o[i] = c[i];\n    }\n    return JSON.stringify(o);\n}\n",
+                                                                                    "|singleNodeToJS": "function (treepath) \n        {\n            var iter = new Gtk.TreeIter(); \n            if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {\n                return false;\n            }\n            \n            var iv = this.getIterValue(iter, 2);\n           \n            return JSON.parse(iv);\n            \n        }",
+                                                                                    "|toJS": "function(treepath, with_id)\n{\n    //Seed.print(\"WITHID: \"+ with_id);\n    var iter = treepath;  // API used to be iter here..\n    if (typeof(iter) == 'string') {\n        iter = new Gtk.TreeIter(); \n        if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {\n            return false;\n        }\n    } \n    var first = false;\n    if (!iter) {\n        \n        this.treemap = { }; \n        \n        iter = new Gtk.TreeIter();\n        if (!this.el.get_iter_first(iter)) {\n            return [];\n        }\n        first = true;\n    } \n    \n    var ar = [];\n       \n    while (true) {\n        \n        var k = this.nodeToJS(iter, with_id); \n        ar.push(k);\n        \n        \n        if (!this.el.iter_next(iter)) {\n            break;\n        }\n    }\n    \n    if (treepath === false) {\n        //dupe!!!\n        return JSON.parse(JSON.stringify(ar));\n    }\n    \n    return ar;\n    // convert the list into a json string..\n\n    \n}",
+                                                                                    "|xns": "Gtk"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "TreeViewColumn",
+                                                                                    "pack": "append_column",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.add_attribute(this.items[0].el , 'markup', 0 );\n}\n",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "CellRendererText",
+                                                                                            "pack": "pack_start"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "Menu",
+                                                                            "pack": false,
+                                                                            "id": "LeftTreeMenu",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "add",
+                                                                                    "label": "Delete Element",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n     this.get('/LeftTree.model').deleteSelected();\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n     var tree = this.get('/LeftTree');\n      var model = this.get('/LeftTree.model');\n     var el = tree.getActivePath();\n     print(el);\n     var js = model.toJS(el, false);\n    // print(JSON.stringify(js[0], null,4));\n     this.get('/DialogSaveTemplate').show(JSON.stringify(js[0], null,4));\n     \n    \n}"
+                                                                                    },
+                                                                                    "label": "Save as Template",
+                                                                                    "pack": "add",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "|xns": "Gtk"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "VBox",
+                                                                    "pack": "add",
+                                                                    "id": "LeftProjectTree",
+                                                                    "|showNoProjectSelected": "function() {\n   this.get('/StandardErrorDialog').show(\"Select a Project first.\"); \n}\n",
+                                                                    "|getActiveProject": "function() {\n     return this.project;\n}\n",
+                                                                    "listeners": {
+                                                                        "leave_notify_event": "function (self, event) {\n    return false;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "pack_start,false,false",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "ComboBox",
+                                                                                    "id": "combo",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.add_attribute(this.get('render').el , 'markup', 1 );  \n}\n",
+                                                                                    "|getValue": "function() {\n    var ix = this.el.get_active();\n    if (ix < 0 ) {\n        return false;\n    }\n    var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;\n    if (typeof(data[ix]) == 'undefined') {\n \treturn false; \n    }\n    return data[ix].fn;\n}",
+                                                                                    "|setValue": "function(fn)\n{\n    var el = this.el;\n    el.set_active(-1);\n    var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;\n    data.forEach(function(n, ix) {\n        if (fn == n.fn) {\n            el.set_active(ix);\n            return false;\n        }\n    });\n}\n",
+                                                                                    "listeners": {
+                                                                                        "changed": "function (self) {\n\tvar fn = this.getValue();\n\tvar pm  = imports.Builder.Provider.ProjectManager.ProjectManager;\n\tthis.get('/LeftProjectTree.model').loadProject(pm.getByFn(fn))\n}"
+                                                                                    },
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "CellRendererText",
+                                                                                            "pack": "pack_start,true",
+                                                                                            "id": "render"
+                                                                                        },
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "ListStore",
+                                                                                            "pack": "set_model",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n  this.el.set_column_types ( 2, [\n        GObject.TYPE_STRING,  // real key\n        GObject.TYPE_STRING // real type\n        \n        \n    ] );\n   var pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n   var _this = this;\n   pm.on('changed', function() {\n       print(\"caught changed hook on project manager - reloading data\");\n\t_this.loadData(pm.projects);\n\n   });\n}\n",
+                                                                                            "|loadData": "function(data) {\n     var ov = this.get('/LeftProjectTree.combo').getValue();\n    this.el.clear();\n    var iter = new Gtk.TreeIter();\n    var el = this.el;\n    data.forEach(function(p) {\n        \n        el.append(iter);\n        \n         \n        el.set_value(iter, 0, p.fn);\n        el.set_value(iter, 1, p.name);\n        \n    });\n    \n    this.get('/LeftProjectTree.combo').setValue(ov);\n}\n",
+                                                                                            "id": "combomodel"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "ScrolledWindow",
+                                                                            "pack": "add",
+                                                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_policy  (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC );\n}\n",
+                                                                            "items": [
+                                                                                {
+                                                                                    "listeners": {
+                                                                                        "cursor_changed": "function (self) {\n \tvar iter = new Gtk.TreeIter();\n                                \n        if (this.selection.count_selected_rows() < 1) {\n            //XN.get('Builder.LeftTree.model').\n            this.get('/LeftTree.model').load( false);\n            \n            return;\n        }\n        var model = this.get('/LeftProjectTree.model');\n        //console.log('changed');\n        var s = this.selection;\n        s.get_selected(model, iter);\n        value = new GObject.Value('');\n        model.el.get_value(iter, 2, value);\n        \n        console.log(value.value);// id..\n        \n        var file = this.get('/LeftProjectTree').project.getById(value.value);\n        \n        file.items = false;\n        console.log(file);\n        \n\n\n        var nb = this.get('/LeftTopPanel.expander');\n        nb.el.expanded = false;\n        nb.onCollapse();\n        //nb.listeners.activate.call(nb);\n        //_expander.el.set_expanded(false);\n\n        var ltm = this.get('/LeftTree.model');\n        ltm.loadFile(file);\n        \n        return true;\n}"
+                                                                                    },
+                                                                                    "id": "view",
+                                                                                    "tooltip_column": 1,
+                                                                                    "xtype": "TreeView",
+                                                                                    "|enable_tree_lines": true,
+                                                                                    "|headers_visible": false,
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\nvar description = new Pango.FontDescription.c_new();\n                            description.set_size(8000);\n                            this.el.modify_font(description);\n                            \n                            this.selection = this.el.get_selection();\n                            this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n}\n",
+                                                                                    "|xns": "Gtk",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "TreeStore",
+                                                                                            "pack": "set_model",
+                                                                                            "id": "model",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n  this.el.set_column_types ( 3, [\n                    GObject.TYPE_STRING, // title \n                    GObject.TYPE_STRING, // tip\n                    GObject.TYPE_STRING // id..\n                    ] );\n   \n}\n",
+                                                                                            "|loadProject": "function(pr) {\nprint(\"LOAD PROJECT\");\n           this.el.clear();\n            if (!pr) {\n                return;\n            }\n            \n            this.get('/LeftProjectTree').project = pr;\n            this.load(pr.toTree());\n            this.get('/LeftProjectTree.view').el.expand_all();\n}\n",
+                                                                                            "|load": "function(tr,iter) {\n  //  console.dump(tr);\n            console.log('Project tree load: ' + tr.length);\n            var citer = new Gtk.TreeIter();\n            //this.insert(citer,iter,0);\n            \n            var _this = this;\n            tr.forEach(function (r) {\n                if (!iter) {\n                    _this.el.append(citer);   \n                } else {\n                    _this.el.insert(citer,iter,-1);\n                }\n                _this.el.set_value(citer, 0,  '' + r.getTitle() ); // title \n                _this.el.set_value(citer, 1, '' + r.getTitleTip()); // tip\n                _this.el.set_value(citer, 2, '' + r.id ); //id\n                if (r.cn && r.cn.length) {\n                    _this.load(r.cn, citer);\n                }\n                \n            });\n}\n",
+                                                                                            "|getValue": "function(iter, col) {\n    var gval = new GObject.Value('');\n    this.el.get_value(iter, col ,gval);\n    return  '' + gval.value;\n}\n"
+                                                                                        },
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "TreeViewColumn",
+                                                                                            "pack": "append_column",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.add_attribute(this.items[0].el , 'markup', 0 );\n}\n",
+                                                                                            "items": [
+                                                                                                {
+                                                                                                    "|xns": "Gtk",
+                                                                                                    "xtype": "CellRendererText",
+                                                                                                    "pack": "pack_start"
+                                                                                                }
+                                                                                            ]
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "listeners": {},
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "HBox",
+                                                            "pack": "pack_start,false,true,0",
+                                                            "id": "LeftProps",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Button",
+                                                                    "pack": "add",
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, event) {\n    this.get('/MidPropTree.model').showData('props');\n    return false;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "add",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Image",
+                                                                                    "pack": "add",
+                                                                                    "|stock": "Gtk.STOCK_ADD",
+                                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Label",
+                                                                                    "pack": "add",
+                                                                                    "label": "Property"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Button",
+                                                                    "pack": "add",
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, event) {\n    this.get('/MidPropTree.model').showData('events');\n    return false;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "add",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Image",
+                                                                                    "pack": "add",
+                                                                                    "|stock": "Gtk.STOCK_ADD",
+                                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Label",
+                                                                                    "pack": "add",
+                                                                                    "label": "Handler"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Button",
+                                                                    "pack": "add",
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, ev) {\n\tvar p = this.get('/AddPropertyPopup');\n\tif (!p.el) {\n\t\tp.init();\n\t}\n \tp.el.set_screen(Gdk.Screen.get_default());\n        p.el.show_all();\n         p.el.popup(null, null, null, null, 3, ev.button.time);\n    return true;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "add",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Image",
+                                                                                    "pack": "add",
+                                                                                    "|stock": "Gtk.STOCK_ADD",
+                                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Label",
+                                                                                    "pack": "add",
+                                                                                    "label": "Other"
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "Menu",
+                                                                            "pack": false,
+                                                                            "id": "AddPropertyPopup",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Using this.get('*someid') will find any id in an application.",
+                                                                                    "label": "ID",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n        key : 'id', \n        type : 'string',\n        val : '',\n        //skel  : skel,\n        etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add what type of packing is to be used",
+                                                                                    "label": "PACK",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n    \t key : 'pack', \n       \t type : 'string',\n       \t val : 'add',\n          etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Override the init method",
+                                                                                    "label": "INIT",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n       key : '|init', \n        type : 'function',\n        val  : \"function() {\\n    XObject.prototype.init.call(this);\\n}\\n\",\n        etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "SeparatorMenuItem",
+                                                                                    "pack": "add"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user defined string property",
+                                                                                    "label": "String",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t\t  key : '', \n                type : 'string',\n                val  : \"\",\n                etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user defined number property",
+                                                                                    "label": "Number",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t\t  key : '', \n                type : 'number',\n                val  : 0,\n                etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user defined boolean property",
+                                                                                    "label": "Boolean",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t\t  key : '', \n                type : 'boolean',\n                val  : false,\n                etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "SeparatorMenuItem",
+                                                                                    "pack": "add"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user function boolean property",
+                                                                                    "label": "Function",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t    key : '|', \n                        type : 'function',\n                        val  : \"function() {\\n    \\n}\\n\",\n                        etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "editing": false,
+                                                            "id": "LeftPanel",
+                                                            "pack": "add",
+                                                            "xtype": "ScrolledWindow",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n}\n",
+                                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                                            "|xns": "Gtk",
+                                                            "items": [
+                                                                {
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, ev) {\n\n    \n    var res = { }; \n    \n    if (!this.el.get_path_at_pos(ev.button.x,ev.button.y, res)) {\n        return false; //not on a element.\n    }\n    \n     // right click.\n     if (ev.type == Gdk.EventType.BUTTON_PRESS  && ev.button.button == 3) {    \n        // show popup!.   \n        if (res.column.title == 'value' && this.get('/LeftPanel').editing) {\n            return false;\n        }\n        //if (! this.get('/LeftPanelPopup')LeftPanelPopup.el) LeftPanelPopup.init();\n        var p = this.get('/LeftPanelPopup');\n        if (!p.el) {\n            p.init();\n        }\n\n        p.el.set_screen(Gdk.Screen.get_default());\n        p.el.show_all();\n        p.el.popup(null, null, null, null, 3, ev.button.time);\n        //Seed.print(\"click:\" + res.column.title);\n        \n        \n        return false;\n    }\n    \n     \n    if (res.column.title != 'value') {\n          //  XObject.error(\"column is not value?\");\n        return false; // ignore.. - key click.. ??? should we do this??\n    }\n    \n    // currently editing???\n//    if (  this.activePath) {\n        \n     //   this.activePath = false;\n       // stop editing!!!!\n        if (this.get('/Editor').dirty) {\n            //if (!this.get('/Editor.buffer').checkSyntax()) {\n            //   this.get('/StandardErrorDialog').show(\"Fix errors in code and save..\"); \n            //   return true;\n            //    // error Dialog\n            //}\n            if (!this.get('/Editor.view').save()) {\n                return true;\n            }\n        }   \n        this.get('/LeftPanel').editableColumn.items[0].el.stop_editing();\n        this.get('/LeftPanel').editing = false;\n    \n    //    XObject.error(\"Currently editing?\");\n     //   return false;\n   // }\n    \n    var renderer = this.get('/LeftPanel').editableColumn.items[0].el; // set has_entry..\n    \n    var type = this.get('/LeftPanel.model').getType(res.path.to_string());\n        \n    // get options for this type -- this is to support option lists etc..\n    var provider = this.get('/LeftTree').getPaleteProvider();\n    var opts = provider.findOptions(type);\n    \n    if (opts === false) {\n        // it's text etnry\n         this.get('/LeftPanel').editableColumn.setOptions([]);\n        renderer.has_entry = true;\n    } else {\n         this.get('/LeftPanel').editableColumn.setOptions(opts);\n        renderer.has_entry = false;\n    }\n    this.get('/LeftPanel.model').startEditing(res.path.to_string(), 1);\n        \n   //Seed.print(\"click\" + ev.type);\n    //console.dump(res);\n    return false;\n\n              \n   \n}"
+                                                                    },
+                                                                    "id": "view",
+                                                                    "tooltip_column": 5,
+                                                                    "xtype": "TreeView",
+                                                                    "|enable_tree_lines": true,
+                                                                    "|headers_visible": false,
+                                                                    "|init": "function() {\n     XObject.prototype.init.call(this); \n                       \n                    this.selection = this.el.get_selection();\n                    this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n                 \n                    \n                    var description = new Pango.FontDescription.c_new();\n                    description.set_size(8000);\n                    this.el.modify_font(description);\n}\n",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "activePath": false,
+                                                                            "id": "model",
+                                                                            "pack": "set_model",
+                                                                            "xtype": "TreeStore",
+                                                                            "|add": "function(info) {\n      // info includes key, val, skel, etype..\n              console.dump(info);\n            type = info.type.toLowerCase();\n            var data = this.toJS();\n            \n            if (info.etype == 'events') {\n                data.listeners = data.listeners || { };\n                if (typeof(data.listeners[info.key]) != 'undefined') {\n                    return; //already set!\n                }\n            } else {\n                if (typeof(data[info.key]) != 'undefined') {\n                    return;\n                }\n            }\n            \n            if (typeof(info.val) == 'undefined') {\n                    \n                info.val = '';\n                if (info.type.toLowerCase() == 'boolean') {\n                    info.val = true;\n                }\n                if (type == 'number') {\n                    info.val = 0;\n                }\n                // utf8 == string..\n                \n                \n            }\n            var k = info.key;\n            if (info.etype == 'events') {\n             \n                data.listeners[info.key] = info.val;\n                k = '!' + info.key;\n            } else {\n                data[info.key] = info.val;\n            }\n            \n            \n            var map = this.load(data);\n            \n            // flag it as changed to the interface..\n\n            this.get('/LeftTree.model').changed(data, true); \n            \n            \n            this.startEditing(map[k]);\n             \n            /*\n            LeftPanel.get('view').el.row_activated(\n                new Gtk.TreePath.from_string(map[k]), \n                LeftPanel.editableColumn.el\n            );\n            */\n}\n",
+                                                                            "|changed": "function(str, doRefresh) {\n    if (!this.activePath) {\n        return;\n    }\n    var iter = new Gtk.TreeIter();\n    this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath));\n    \n    this.el.set_value(iter, 1, '' +str);\n    this.el.set_value(iter, 3, '' + this.toShort(str));\n    var type = this.getIterValue(iter, 4);\n\n    this.el.set_value(iter, 5, type + ' : ' + str);\n    // update the tree...  \n\n    this.get('/LeftTree.model').changed(this.toJS(), doRefresh); \n}\n",
+                                                                            "|deleteSelected": "function() {\n     var data = this.toJS();\n    var iter = new Gtk.TreeIter();\n    var s = this.get('/LeftPanel.view').selection;\n    s.get_selected(this.el, iter);\n         \n       \n    var gval = new GObject.Value('');\n   this.get('/LeftPanel.model').el.get_value(iter, 0 ,gval);\n    \n    var val = gval.value;\n    if (val[0] == '!') {\n        // listener..\n        if (!data.listeners || typeof(data.listeners[  val.substring(1)]) == 'undefined') {\n            return;\n        }\n        delete data.listeners[  val.substring(1)];\n        if (!XObject.keys(data.listeners).length) {\n            delete data.listeners;\n        }\n        \n    } else {\n        if (typeof(data[val]) == 'undefined') {\n            return;\n        }\n        delete data[val];\n    }\n    \n    \n    this.load(data);\n    this.get('/LeftTree.model').changed(data, true);\n    \n}\n",
+                                                                            "|getIterValue": "function(iter, col) {\n     var gval = new GObject.Value('');\n    this.get('/LeftPanel.model').el.get_value(iter, col ,gval);\n    return '' + gval.value;\n}\n",
+                                                                            "|getType": "function(treepath) {\n     return this.getValue(treepath, 4);\n}\n",
+                                                                            "|getValue": "function(treepath_str, col) \n{\n   // get's the  value in a row.. - keys - returns string, values - formats it..\n\n    var iter = new Gtk.TreeIter();\n    this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath_str));\n    \n    var gval = new GObject.Value('');\n    this.get('/LeftPanel.model').el.get_value(iter, col ,gval);\n    var val = '' + gval.value;\n   \n    if (col != 1) {\n        return val;\n    }\n    var type = this.getType(this.el.get_path(iter).to_string());\n    //print(\"TYPE: \" +type + \" -  val:\" + val);\n    switch(type.toLowerCase()) {\n        case 'number':\n        case 'uint':\n        case 'int':\n            return parseFloat(val); // Nan ?? invalid!!?        \n        case 'float':\n        case 'gfloat':\n            return 1.0 * parseFloat(val); // Nan ?? invalid!!?\n        case 'boolean':\n            return val == 'true' ? true : false;\n        default: \n            var nv = parseFloat(val);\n            if (!isNaN(nv) && (val == ''+nv)) {\n                return nv;\n            }\n            return val;\n    }\n                            \n}\n",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\nthis.el.set_column_types ( 6, [\n                                GObject.TYPE_STRING,  // 0 real key\n                                GObject.TYPE_STRING, // 1 real value \n                                 GObject.TYPE_STRING,  // 2 visable key\n                                 GObject.TYPE_STRING, // 3 visable value\n                                 GObject.TYPE_STRING, // 4 need to store type of!!!\n                                  GObject.TYPE_STRING // 5 tooltip\n                              \n                            ]);\n}\n",
+                                                                            "|load": "function(ar) {\n  this.el.clear();\n                        \n    //this.get('/RightEditor').el.hide();\n    if (ar === false) {\n        return ;\n    }\n    var ret = {}; \n    \n\n    var provider = this.get('/LeftTree').getPaleteProvider();\n     var iter = new Gtk.TreeIter();\n     \n    // sort!!!?\n    var keys  = XObject.keys(ar);\n    keys.sort();\n    ar.listeners = ar.listeners || {};\n    \n    for (var i in ar.listeners ) {\n        this.el.append(iter);\n        var p = this.el.get_path(iter).to_string();\n        ret['!' + i] = p;\n        \n        this.el.set_value(iter, 0, '!'+  i  );\n        this.el.set_value(iter, 1, '' + ar.listeners[i]);\n        this.el.set_value(iter, 2, '<b>'+ i + '</b>');\n        \n        this.el.set_value(iter, 3, '' + this.toShort(ar.listeners[i]));\n        this.el.set_value(iter, 4, 'function');\n        this.el.set_value(iter, 5, i + ' : ' + ar.listeners[i]);\n    }\n    \n    \n   \n    var _this = this;\n    keys.forEach(function(i) {\n        if (typeof(ar[i]) == 'object') {\n            return;\n        }\n        \n        var type = provider.findType(ar, i, ar[i]);\n        \n        _this.el.append(iter);\n        var p = _this.el.get_path(iter).to_string();\n        ret[i] = p;\n        _this.el.set_value(iter, 0, ''+i);\n        _this.el.set_value(iter, 1, '' + ar[i]);  \n        _this.el.set_value(iter, 2, ''+i);\n        _this.el.set_value(iter, 3, ''+ _this.toShort(ar[i]));\n        _this.el.set_value(iter, 4, ''+type);\n        _this.el.set_value(iter, 5, type + ' : ' + ar[i]);\n    })\n    return ret;\n}\n",
+                                                                            "|startEditing": "function(path,col) {\n    \n    // alled by menu 'edit' currently..\n    /**\n    * start editing path (or selected if not set..)\n    * @param {String|false} path  (optional) treepath to edit - selected tree gets\n    *     edited by default.\n    * @param {Number} 0 or 1 (optional)- column to edit. \n    */\n    // fix tp to be the 'treepath' string (eg. 0/1/2...)\n    var tp;\n    if (typeof(path) == 'string') {\n        tp = new Gtk.TreePath.from_string(path);\n    } else {\n        var iter = new Gtk.TreeIter();\n        var s = this.get('/LeftPanel.view').selection;\n        s.get_selected(this.el, iter);\n        tp = this.el.get_path(iter);\n        path = tp.to_string();\n    }\n    \n   \n    // which colum is to be edited..\n    var colObj = false;\n    \n    // not sure what this does..\n    \n    if (typeof(col) == 'undefined') {\n        var k = this.getValue(path, 0);\n        col = 1;\n        colObj = (!k.length || k == '|') ? \n            this.get('/LeftPanel').propertyColumn : this.get('/LeftPanel').editableColumn;\n    } else {\n        colObj = col ? this.get('/LeftPanel').editableColumn : this.get('/LeftPanel').propertyColumn;\n    }\n    \n    // make sure the pulldown is set correctly..\n    // not really needed for second col...\n    var showEditor = false;\n    \n    if (col) {\n        var provider = this.get('/LeftTree').getPaleteProvider();\n        var type = this.get('/LeftPanel.model').getType(path);\n        var opts = provider.findOptions(type);\n        var renderer = this.get('/LeftPanel').editableColumn.items[0].el;\n        \n        if (opts === false) {\n            this.get('/LeftPanel').editableColumn.setOptions([]);\n            renderer.has_entry = true; \n        } else {\n            this.get('/LeftPanel').editableColumn.setOptions(opts);\n            renderer.has_entry = false;/// - pulldowns do not have entries\n        }\n        // determine if we should use the Text editor...\n        var keyname = this.getValue(path, 0);\n        var data_value = this.getValue(path, 1);\n    \n        if ((keyname[0] == '|') || \n            (   \n                (typeof(data_value) == 'string' ) && \n                ( data_value.match(/function/g) || data_value.match(/\\n/g)) // || (data_value.length > 20))\n            )) {\n            showEditor = true;\n        }\n        print(\"SHOW EDITOR\" + showEditor ? 'YES' :'no');\n        \n    }\n    var _this = this;    \n    // end editing..\n    this.get('/BottomPane').el.hide();\n    //this.get('/RightEditor').el.hide();\n     this.get('/Editor').el.hide();\n    \n    if (showEditor) {\n\n        this.activePath = false;\n        _this.get('/Editor').el.show_all();\n        GLib.timeout_add(0, 1, function() {\n\n            //_this.get('/BottomPane').el.show();\n             //_this.get('/RightEditor').el.show();\n            \n            _this.get('/Editor.RightEditor.view').load( _this.getValue(path, 1) );\n            \n            //e.editing_done();\n            //e.remove_widget();\n            _this.activePath = path ;\n          \n            return false;\n        });\n        return;\n    }\n      \n    \n    \n\n    // iter now has row...\n    GLib.timeout_add(0, 100, function() {\n        _this.activePath = path;\n        colObj.items[0].el.editable = true; // esp. need for col 0..\n        _this.get('/LeftPanel.view').el.set_cursor_on_cell(\n            tp,\n            colObj.el,\n            colObj.items[0].el,\n            true\n        );\n    });\n    \n}\n",
+                                                                            "|toJS": "function() {\n     var iter = new Gtk.TreeIter();\n    this.get('/LeftPanel.model').el.get_iter_first(iter);\n    var ar = {};\n       \n    while (true) {\n        \n        var k = this.getValue(this.el.get_path(iter).to_string(), 0);\n       // Seed.print(k);\n        if (k[0] == '!') {\n            ar.listeners = ar.listeners || {};\n            ar.listeners[  k.substring(1)] = this.getValue(this.el.get_path(iter).to_string(), 1);\n            \n        } else {\n            ar[ k ] = this.getValue(this.el.get_path(iter).to_string(), 1);\n        }\n        \n        if (! this.get('/LeftPanel.model').el.iter_next(iter)) {\n            break;\n        }\n    }\n    \n    \n    //print(JSON.stringify(ar));\n    return ar;\n    // convert the l\n}\n",
+                                                                            "|toShort": "function(str) {\n    var a = typeof(str) == 'string' ? str.split(\"\\n\") : [];\n        return a.length > 1 ? a[0] + '....' : '' + str;\n}\n",
+                                                                            "|xns": "Gtk"
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "TreeViewColumn",
+                                                                            "pack": "append_column",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\n    this.el.add_attribute(this.items[0].el , 'markup', 2 );\n    this.get('/LeftPanel').propertyColumn = this;\n}\n",
+                                                                            "title": "key",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "CellRendererText",
+                                                                                    "pack": "pack_start",
+                                                                                    "listeners": {
+                                                                                        "editing_started": "function (self, editable, path) {\n\n        this.get('/LeftPanel.model').activePath  = path;\n\n}",
+                                                                                        "edited": "function (self, object, p0) {\n\tvar model = this.get('/LeftPanel.model');\n        var path = model.activePath;\n        var iter = new Gtk.TreeIter();\n        model.el.get_iter(iter, new Gtk.TreePath.from_string(path));\n        model.el.set_value(iter, 0, p0);\n        model.el.set_value(iter, 2, p0);\n        \n\tmodel.activePath = false;\n\n\tthis.get('/LeftTree.model').changed(model.toJS(), true); \n        this.el.editable = false;\n}"
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "pack": "append_column",
+                                                                            "title": "value",
+                                                                            "xtype": "TreeViewColumn",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.add_attribute(this.items[0].el , 'text', 3 );\n\tthis.el.add_attribute(this.items[0].el , 'sensitive', 3 );\n\t//this.el.add_attribute(this.items[0].el , 'editable', 3 );\n          // this.el.set_cell_data_func(cell, age_cell_data_func, NULL, NULL);\n\n \tthis.get('/LeftPanel').editableColumn= this;\n}\n",
+                                                                            "|setOptions": "function(ar) {\n       var m = this.items[0].el.model;\n            m.clear();\n            var iter = new Gtk.TreeIter();\n            ar.forEach(function(i) {\n                   // sort!!!?\n                m.append(iter);\n                m.set_value(iter, 0, i);\n            });\n            \n}\n",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "listeners": {
+                                                                                        "edited": "function (self, object, p0) {\n \tthis.get('/LeftPanel').editing = false;\n \tvar ap = this.get('/LeftPanel.model').activePath\n\tprint(\"EDITED? \"  + ap + \" - p:\" + p0 + \" t:\" + p0);\n        this.get('/LeftPanel.model').changed(p0, true);\n        this.get('/LeftPanel.model').activePath = false;\n        this.el.editable = false;\n}",
+                                                                                        "editing_started": "function (self, editable, path) {\n   this.get('/LeftPanel').editing  = true;\n\t//  console.log('editing started');\n       // r.has_entry = false;\n\n    this.el.editable = false; // make sure it's not editor...\n   \n}"
+                                                                                    },
+                                                                                    "editable": false,
+                                                                                    "pack": "pack_start",
+                                                                                    "text_column": 0,
+                                                                                    "xtype": "CellRendererCombo",
+                                                                                    "|has_entry": true,
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.model = new Gtk.ListStore();\n    this.el.model.set_column_types ( 1, [\n        GObject.TYPE_STRING  // 0 real key\n      ]);\n}\n",
+                                                                                    "|xns": "Gtk"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Menu",
+                                                                    "pack": false,
+                                                                    "id": "LeftPanelPopup",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "MenuItem",
+                                                                            "pack": "append",
+                                                                            "label": "Delete",
+                                                                            "listeners": {
+                                                                                "activate": "function (self) {\n\tthis.get('/LeftPanel.model').deleteSelected();\n}"
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "MenuItem",
+                                                                            "pack": "append",
+                                                                            "label": "Edit",
+                                                                            "listeners": {
+                                                                                "activate": "function (self) {\n\tthis.get('/LeftPanel.model').startEditing(false, 0);\n}"
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "ScrolledWindow",
+                                            "pack": "pack_end,false,true,0",
+                                            "id": "MidPropTree",
+                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n       XObject.prototype.init.call(this); \n    this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)\n    this.el.set_size_request ( 150, -1 );\n    this.shown = true;\n}\n",
+                                            "activeElement": false,
+                                            "|hideWin": "function() {\n     \n    if (!this.shown) {\n        return;\n    }\n    \n    \n    if (this.get('/Window.left').el.position < 160) {\n        return;\n    }\n    this.get('/Window.left').el.position = this.get('/Window.left').el.position  - 150;\n        \n    this.el.hide();\n    this.shown = false;\n}\n",
+                                            "items": [
+                                                {
+                                                    "listeners": {
+                                                        "cursor_changed": "function (self) {\n       var iter = new Gtk.TreeIter();\n                        \n                        //console.log('changed');\n        var m = this.get('model');\n\tif (!this.selection){\n\t\tthis.selection = this.el.get_selection();\n\t}\n\n        var s = this.selection;\n        if (!s.get_selected(m.el, iter)) {\n\t\treturn; \n\t}\n        var tp = m.el.get_path(iter).to_string();\n        \n        \n        // var val = \"\";\n        \n        var key = m.getValue(tp, 0);\n        \n        var type = m.getValue(tp, 1);\n        var skel = m.getValue(tp, 3);\n        var etype = m.getValue(tp, 5);\n        \n        \n        this.get('/MidPropTree').hideWin();\n\n        if (type.toLowerCase() == 'function') {\n            \n            if (etype != 'events') {\n                key = '|' + key;\n            }\n            \n            this.get('/LeftPanel.model').add({\n                key :  key, \n                type : type,\n                val  : skel,\n                etype : etype\n            })  \n            return;\n        }\n        // has dot in name, and is boolean???? this does not make sense..\n        //if (type.indexOf('.') > -1 ||  type.toLowerCase() == 'boolean') {\n        //     key = '|' + key;\n       // }\n        \n        this.get('/LeftPanel.model').add( {\n            key : key, \n            type : type,\n            //skel  : skel,\n            etype : etype\n           }) //, \n}"
+                                                    },
+                                                    "pack": "add",
+                                                    "tooltip_column": 2,
+                                                    "xtype": "TreeView",
+                                                    "|enable_tree_lines": true,
+                                                    "|headers_visible": false,
+                                                    "|init": "function() {\n\tXObject.prototype.init.call(this); \n                    \n       var description = new Pango.FontDescription.c_new();\n     description.set_size(8000);\n    this.el.modify_font(description);     \n                    \n    //this.selection = this.el.get_selection();\n    // this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n \n\n    \n  \n    \n}\n",
+                                                    "|xns": "Gtk",
+                                                    "items": [
+                                                        {
+                                                            "id": "model",
+                                                            "pack": "set_model",
+                                                            "xtype": "ListStore",
+                                                            "|getValue": "function(treepath, col)\n{\n    var tp = new Gtk.TreePath.from_string (treepath);\n    var iter = new Gtk.TreeIter();\n    this.el.get_iter (iter, tp);\n    var value = new GObject.Value('');\n    this.el.get_value(iter, col, value);\n    return value.value;\n    \n}",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.set_column_types ( 6, [\n        GObject.TYPE_STRING,  // real key\n         GObject.TYPE_STRING, // real type\n         GObject.TYPE_STRING, // docs ?\n         GObject.TYPE_STRING, // visable desc\n         GObject.TYPE_STRING, // function desc\n         GObject.TYPE_STRING // element type (event|prop)\n        \n    ] );\n}\n",
+                                                            "|showData": "function(type) {\n    this.el.clear();\n            if (!this.get('/MidPropTree').activeElement || !type) {\n                return; // no active element\n            }\n\n            var fullpath = this.get('/LeftTree.model').file.guessName(this.get('/MidPropTree').activeElement);\n            var palete = this.get('/LeftTree').getPaleteProvider();\n            \n             \n            \n            Seed.print('Showing right?');\n            if (!this.get('/MidPropTree').shown) {\n\n                this.get('/Window.left').el.position = this.get('/Window.left').el.position  + 150;\n                this.get('/MidPropTree').el.show();\n                this.get('/MidPropTree').shown = true;\n            }\n            \n            var elementList = palete.getPropertiesFor(fullpath, type).sort(function(a,b) { \n                return a.name >  b.name ? 1 : -1;\n            });\n            print (\"GOT \" + elementList.length + \" items for \" + fullpath + \"|\" + type);\n           // console.dump(elementList);\n           \n            \n            var iter = new Gtk.TreeIter();\n            for(var i =0 ; i < elementList.length; i++) {\n                var p=elementList[i];\n                this.el.append(iter);\n              //  console.log( '<b>' + p.name +'</b> ['+p.type+']');\n                    //GObject.TYPE_STRING,  // real key\n                    // GObject.TYPE_STRING, // real type\n                    // GObject.TYPE_STRING, // docs ?\n                    // GObject.TYPE_STRING // func def?\n                    \n                \n                this.el.set_value(iter, 0, p.name);\n                this.el.set_value(iter, 1, p.type);\n                this.el.set_value(iter, 2, '<span size=\"small\"><b>' + p.name +'</b> ['+p.type+']</span>' + \"\\n\" + p.desc);\n                this.el.set_value(iter, 3, p.sig ? p.sig  : '');\n                this.el.set_value(iter, 4, '<span size=\"small\"><b>' + p.name +'</b> ['+p.type+']</span>');\n                this.el.set_value(iter, 5, type);\n                \n            }\n                             \n}\n",
+                                                            "|xns": "Gtk"
+                                                        },
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "TreeViewColumn",
+                                                            "|init": "function() {\n    this.el = new Gtk.TreeViewColumn();\n    this.parent.el.append_column(this.el);\n    \n    XObject.prototype.init.call(this);\n    this.el.add_attribute(this.items[0].el , 'markup', 4  );\n}\n",
+                                                            "pack": false,
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "CellRendererText",
+                                                                    "pack": "pack_start,true"
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "HBox",
+                                    "pack": "add",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "VPaned",
+                                            "pack": "add",
+                                            "position": 300,
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "pack": "add",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "Notebook",
+                                                            "pack": "pack_start,true,true",
+                                                            "id": "view-help-nb",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Preview\" }));\n    this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : \"Help\" }));\n}\n",
+                                                            "items": [
+                                                                {
+                                                                    "id": "view-notebook",
+                                                                    "pack": "add",
+                                                                    "tab_border": 0,
+                                                                    "xtype": "Notebook",
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_current_page(0);\n    //print(\"SET LABEL?\")\n    this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Roo View\" }));\n    this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : \"Gtk View\" }));\n}\n",
+                                                                    "|show_tabs": false,
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "id": "RightBrowser",
+                                                                            "pack": "add",
+                                                                            "xtype": "VBox",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "pack": "pack_start,false,true,0",
+                                                                                    "xtype": "HBox",
+                                                                                    "|xns": "Gtk",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "clicked": "function (self) {\n  this.get('/RightBrowser.view').renderJS(null,true);\n}"
+                                                                                            },
+                                                                                            "label": "Redraw",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "xtype": "Button",
+                                                                                            "|xns": "Gtk"
+                                                                                        },
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "toggled": "function (self, state) {\n    this.el.set_label(this.el.active  ? \"Auto Redraw On\" : \"Auto Redraw Off\");\n}"
+                                                                                            },
+                                                                                            "active": true,
+                                                                                            "id": "AutoRedraw",
+                                                                                            "label": "Auto Redraw On",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "xtype": "CheckButton",
+                                                                                            "|xns": "Gtk"
+                                                                                        }
+                                                                                    ]
+                                                                                },
+                                                                                {
+                                                                                    "pack": "add",
+                                                                                    "xtype": "ScrolledWindow",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n}\n",
+                                                                                    "|shadow_type": "Gtk.ShadowType.IN",
+                                                                                    "|xns": "Gtk",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "load_finished": "function (self, object) {\n    print(\"load finished\");\n//    print(\"load_finished\"); return;\n\t// if (this.ready) { // dont do it twice!\n\t //   return; \n\t//}\n\tif (!this.inspectorShown) {\n           this.el.get_inspector().show();\n           this.inspectorShown = true;\n\t}\n\n\tthis.ready = true;\n\t\n        if (this.pendingRedraw) {\n            this.pendingRedraw = false;\n            this.refreshRequired  = true;\n        }\n        //var js = this.get('/LeftTree.model').toJS();\n        //if (js && js[0]) {\n    \t//    this.renderJS(js[0]);\n    \t//}\n\n}",
+                                                                                                "script_alert": "function (self, object, p0) {\n    // \tprint(p0);\n        return false;\n        return true; // do not display anything...\n}",
+                                                                                                "console_message": "function (self, object, p0, p1) {\n    print(object);\n   //  console.log(object);\n        if (!object.match(/^\\{/)) {\n        \n            //this.get('/Terminal').feed(object);\n            return true; // do not handle!!! -> later maybe in console..\n        }\n       // console.log(object);\n        var val =  JSON.parse(object);\n\n        if (typeof(val['hover-node']) != 'undefined') {\n            this.activeNode = val['hover-node'];\n            console.log('active node: ' + this.activeNode);\n            return true;\n        }\n\n         var ret = false;\n         if (typeof(val['id']) != 'undefined') {\n           // this.activeNode = val['id'];\n            var tg = this.get('/LeftTree.model').findDropNode(val['id'], true); \n            if (!tg || typeof(tg[0]) == 'undefined') {\n                return false;\n            }\n            print(\"SELECT node \" + tg[0]);\n            \n            this.get('/LeftTree.view').selectNode(tg[0]);\n            ret  = true;\n            \n        } \n        if (ret && typeof(val['set']) != 'undefined') {\n           this.get('/LeftPanel.model').add({\n                key : val['set'],\n                val : val['value']\n            });\n            //console.log('active node: ' + this.activeNode);\n            \n        }\n        //Seed.print('a:'+a);\n        //Seed.print('b:'+b);\n        //Seed.print('c:'+c);\n        return ret;\n}",
+                                                                                                "drag_motion": "function (w, ctx,  x,   y,   time, ud) {\n   // console.log('DRAG MOTION'); \n        // status:\n        // if lastCurrentNode == this.currentNode.. -- don't change anything..\n        this.targetData = [];\n        this.el.execute_script(\"Builder.overPos(\" + x +','+ y + \");\");\n        \n        // A) find out from drag all the places that node could be dropped.\n        var src = Gtk.drag_get_source_widget(ctx);\n        if (!src.dropList) {\n            Gdk.drag_status(ctx, 0, time);\n            return true;\n        }\n        // b) get what we are over.. (from activeNode)\n        // tree is empty.. - list should be correct..\n        if (!this.get('/LeftTree.model').currentTree) {\n            Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n            return true;\n            \n        }\n        // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)\n        \n        var tg = this.get('/LeftTree.model').findDropNode(this.activeNode, src.dropList);\n        console.dump(tg);\n        if (!tg.length) {\n            Gdk.drag_status(ctx, 0,time);\n            this.get('/LeftTree.view').highlight(false);\n            return true;\n        }\n         \n        // if we have a target..\n        // -> highlight it! (in browser)\n        // -> highlight it! (in tree)\n        \n        Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n        this.get('/LeftTree.view').highlight(tg);\n        this.targetData = tg;\n        // for tree we should handle this...\n        return true;\n}",
+                                                                                                "drag_drop": "function (w, ctx, x, y,time, ud) {\n\tprint(\"TARGET: drag-drop\");\n        var is_valid_drop_site = true;\n        \n         \n        Gtk.drag_get_data\n        (\n                w,         /* will receive 'drag-data-received' signal */\n                ctx,        /* represents the current state of the DnD */\n                this.get('/Window').atoms[\"STRING\"],    /* the target type we want */\n                time            /* time stamp */\n        );\n                        \n                        \n                        /* No target offered by source => error */\n                       \n\n\treturn  is_valid_drop_site;\n}",
+                                                                                                "drag_data_received": "function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) \n    {\n        print(\"Browser: drag-data-received\");\n        var delete_selection_data = false;\n        vardnd_success = false;\n        /* Deal with what we are given from source */\n        if( sel_data && sel_data.length ) {\n            \n            if (ctx.action == Gdk.DragAction.ASK)  {\n                /* Ask the user to move or copy, then set the ctx action. */\n            }\n\n            if (ctx.action == Gdk.DragAction.MOVE) {\n                delete_selection_data = true;\n            }\n            var source = Gtk.drag_get_source_widget(ctx);\n\n            print(\"Browser: source.DRAGDATA? \" + source.dragData);\n            if (this.targetData) {\n                print(this.targetData);\n                this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);\n            }\n            \n            \n            \n            dnd_success = true;\n\n        }\n\n        if (dnd_success == false)\n        {\n                Seed.print (\"DnD data transfer failed!\\n\");\n        }\n        \n        Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);\n        return true;\n    }",
+                                                                                                "create_web_view": "function (self, object) {\n  print(\"CREATE WEB VIEW\");\n   return null; //new WebKit.WebView();\n}"
+                                                                                            },
+                                                                                            "redraws": 0,
+                                                                                            "id": "view",
+                                                                                            "pack": "add",
+                                                                                            "xtype": "WebView",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    // this may not work!?\n    var settings =  this.el.get_settings();\n    settings.enable_developer_extras = true;\n    \n    // this was an attempt to change the url perms.. did not work..\n    // settings.enable_file_access_from_file_uris = true;\n    // settings.enable_offline_web_application_cache - true;\n    // settings.enable_universal_access_from_file_uris = true;\n    var _this = this;\n     \n     // init inspector..\n    this.el.get_inspector().signal.inspect_web_view.connect(function(wi, pg) {\n         _this.get('/BottomPane.inspector').el.show();\n         return _this.get('/BottomPane.inspector').el;\n    \n    });\n     \n     // FIXME - base url of script..\n     // we need it so some of the database features work.\n    this.el.load_html_string( \"Render not ready\" , \n            //fixme - should be a config option!\n            // or should we catch stuff and fix it up..\n            'http://localhost/app.Builder/'\n    );\n        \n        \n   //this.el.open('file:///' + __script_path__ + '/../builder.html');\n                          \n    Gtk.drag_dest_set\n    (\n            this.el,              /* widget that will accept a drop */\n            Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,\n            null,            /* lists of target to support */\n            0,              /* size of list */\n            Gdk.DragAction.COPY         /* what to do with data after dropped */\n    );\n                            \n   // print(\"RB: TARGETS : \" + LeftTree.atoms[\"STRING\"]);\n    Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);\n    \n    GLib.timeout_add_seconds(0, 1, function() {\n        //    print(\"run refresh?\");\n         _this.runRefresh(); \n         return true;\n     });\n    \n    \n}\n",
+                                                                                            "|renderJS": "function(data, force) {\n\n    // this is the public redraw call..\n    // we refresh in a loop privately..\n    var autodraw = this.get('/RightBrowser.AutoRedraw').el.active;\n    if (!autodraw && !force) {\n        print(\"Skipping redraw - no force, and autodraw off\");\n        return;\n    }\n    this.refreshRequired  = true;\n}\n",
+                                                                                            "|runRefresh": "function() \n{\n    // this is run every 2 seconds from the init..\n\n  \n    \n    if (!this.refreshRequired) {\n       // print(\"no refresh required\");\n        return;\n    }\n\n    if (this.lastRedraw) {\n       // do not redraw if last redraw was less that 5 seconds ago.\n       if (((new Date()) -  this.lastRedraw) < 5000) {\n            return;\n        }\n    }\n    \n    \n    \n    \n     if (!this.get('/Window.LeftTree').getActiveFile()) {\n        return;\n     }\n     this.refreshRequired = false;\n   //  print(\"HTML RENDERING\");\n     \n     this.get('/BottomPane').el.show();\n     this.get('/BottomPane').el.set_current_page(2);// webkit inspector\n\n    \n    var js = this.get('/LeftTree.model').toJS();\n    if (!js || !js.length) {\n        print(\"no data\");\n        return;\n    }\n    var  data = js[0];\n    this.redraws++;\n    \n     var project = this.get('/Window.LeftTree').getActiveFile().project;\n     //print (project.fn);\n     // set it to non-empty.\n     project.runhtml  =     project.runhtml  || '';\n     project.runhtml  = project.runhtml.length ?  project.runhtml : '<script type=\"text/javascript\"></script>'; \n    \n\n     this.runhtml  = this.runhtml || '';\n    \n     if ((project.runhtml != this.runhtml) || (this.redraws > 10)) {\n        // then we need to reload the browser using\n        // load_html_string..\n        \n        // then trigger a redraw once it's loaded..\n        this.pendingRedraw = true;\n         var runhtml = '<script type=\"text/javascript\">' + \"\\n\" ;\n         runhtml +=imports.File.File.read(__script_path__ + '/../builder.html.js') + \"\\n\";\n         runhtml += '</script>'+ \"\\n\" ;\n        \n        this.runhtml = project.runhtml;\n        // need to modify paths\n        \n        \n        \n        var html = imports.File.File.read(__script_path__ + '/../builder.html');\n        html = html.replace('</head>', runhtml + this.runhtml + '</head>');\n        print(\"LOAD HTML \" + html);\n        this.el.load_html_string( html , \n            //fixme - should be a config option!\n            'http://localhost/app.Builder/'\n        );\n        this.redraws = 0;\n        // should trigger load_finished! - which in truns shoudl set refresh Required;\n        return;\n    \n    }\n    \n    \n    this.renderedData = data;\n    var str = JSON.stringify(data) ;\n    \n    if (!this.ready) {\n        console.log('not loaded yet');\n    }\n    this.lastRedraw = new Date();\n\n    this.el.execute_script(\"Builder.render(\" + JSON.stringify(data) + \");\");\n     print( \"before render\" +    this.lastRedraw);\n    print( \"after render\" +    (new Date()));\n    \n}\n",
+                                                                                            "|xns": "WebKit"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "id": "RightGtkView",
+                                                                            "pack": "add",
+                                                                            "xtype": "VBox",
+                                                                            "|redraw": "function() {\n   this.highlightWidget = false;\n    print(\"REDRAW CALLED\");\n    this.activePath = this.get('/LeftTree').getActivePath();\n    if (this.renderedEl) {\n      print(\"QUEUE DRAW CALLING\");\n      this.renderedEl.queue_draw();\n   }\n}\n",
+                                                                            "|renderJS": "function(data, withDebug)\n{\n      this.highlightWidget = false;\n   \n    this.withDebug = false;\n    while (this.get('view').el.get_children().length) {\n        var c = this.get('view').el.get_children()[0];\n        this.get('view').el.remove(c);        \n        c.destroy();\n    }\n     if (!data) {\n         return; \n    }\n    \n    var tree =  this.get('/LeftTree.model').toJS(false,true)[0];\n    // in theory tree is actually window..  \n   try {\n  \n        this.renderedEl = this.viewAdd(tree.items[0], this.get('view').el);\n      \n  } catch (e) {\n     print(e.message);\n    return;\n  }\n    this.get('view').el.set_size_request(\n        tree.default_width * 1 || 400, tree.default_height * 1 || 400\n    ) ;\n    if (this.renderedEl) {\n        this.renderedEl.set_size_request(\n            tree.default_width || 600,\n            tree.default_height || 400\n        );\n    }\n    this.get('view').el.show_all();\n    \n    \n    \n}",
+                                                                            "|showInWindow": "function() {\n  print(\"GET PROEJCT\");\n\tvar pr = this.get('/LeftProjectTree').getActiveProject();\n  \n\tconsole.log(pr.paths);\n    return;\n/*\n     var src= this.buildJS(\n\t\tthis.get('/LeftTree.model').toJS()[0], \n\t\ttrue);\n      // show term?? \n\n\n    //var x = new imports.sandbox.Context();\n    //x.add_globals();\n    //print(src);\n    try {\n        Seed.check_syntax('var e = ' + src);\n        //x.eval(src);\n    } catch( e) {\n        this.get('/Terminal').feed(e.message || e.toString() + \"\\n\");\n        this.get('/Terminal').feed(console._dump(e)+\"\\n\");\n        if (e.line) {\n            var lines = src.split(\"\\n\");\n            var start = Math.max(0, e.line - 10);\n            var end = Math.min(lines.length, e.line + 10);\n            for (var i =start ; i < end; i++) {\n                if (i == e.line) {\n                    this.get('/Terminal').feed(\">>>>>\" + lines[i] + \"\\n\");\n                    continue;\n                }\n                this.get('/Terminal').feed(lines[i] + \"\\n\");\n            }\n            \n        }\n        \n        return;\n    }\n     this.get('/BottomPane').el.set_current_page(1);\n    this.get('/Terminal').el.fork_command( null , [], [], \"/tmp\", false,false,false); \n    var cmd = \"/usr/bin/seed /tmp/BuilderGtkView.js\\n\";\n    this.get('/Terminal').el.feed_child(cmd, cmd.length);\n     /*\n    var _top = x.get_global_object()._top;\n    \n    _top.el.set_screen(Gdk.Screen.get_default()); // just in case..\n    _top.el.show_all();\n    if (_top.el.popup) {\n        _top.el.popup(null, null, null, null, 3, null);\n    }\n*/\n}\n",
+                                                                            "|viewAdd": "function(item, par)\n        {\n    // does something similar to xobject..\n    item.pack = (typeof(item.pack) == 'undefined') ?  'add' : item.pack;\n    \n    if (item.pack===false || item.pack === 'false') {  // no ;\n        return;\n    }\n    print(\"CREATE: \" + item['|xns'] + '.' + item['xtype']);\n    var type = item['|xns'] + '.' + item['xtype'];\n    \n    if (item['|xns'] == 'GtkClutter') { // we can not add this yet!\n        return false;\n    }\n    var ns = imports.gi[item['|xns']];\n    var ctr = ns[item['xtype']];\n    var ctr_args = { };\n    for(var k in item) {\n        var kv = item[k];\n        if (typeof(kv) == 'object' || typeof(kv) == 'function') {\n            continue;\n        }\n        if ( \n            k == 'pack' ||\n            k == 'items' ||\n            k == 'id' ||\n            k == 'xtype' ||\n            k == 'xdebug' ||\n            k == 'xns' ||\n            k == '|xns'\n        ) {\n            continue;\n        }\n\n\tif (k[0] == '|' && typeof(kv) == 'string') {\n\n\t\tif (kv.match(new RegExp('function'))) {\n\t\t\tcontinue;\n                }\n\t\t print(\"WASL \" + k + '=' + kv);\n\t\ttry {\n\t\t\teval( 'kv = ' + kv);\n\t\t} catch(e) {    continue; }\n                \n\t\tk = k.substring(1);\n             // print(k + '=' + kv);\n\t}\n        if (k[0] == '|') { // should be boolean or number..\n\t\tk = k.substring(1);\n\t\t//print(k + '=' + kv);\n        }\n         \n\tif (k == 'show_tabs') { // force tab showing for notebooks.\n           kv = true;\n        }\n        print(k + '=' + typeof(kv) + \" : \" + kv);\n        ctr_args[k] = kv;\n        \n    } \n    \n    \n    var el = new ctr(ctr_args);\n    \n    print(\"PACK\" + item.pack);\n    //console.dump(item.pack);\n    \n    \n    \n    \n    var args = [];\n    var pack_m  = false;\n    if (typeof(item.pack) == 'string') {\n         \n        item.pack.split(',').forEach(function(e, i) {\n            \n            if (e == 'false') { args.push( false); return; }\n            if (e == 'true') {  args.push( true);  return; }\n            if (!isNaN(parseInt(e))) { args.push( parseInt(e)); return; }\n            args.push(e);\n        });\n        //print(args.join(\",\"));\n        \n        pack_m = args.shift();\n    } else {\n        pack_m = item.pack.shift();\n        args = item.pack;\n    }\n    \n    // handle error.\n    if (pack_m && typeof(par[pack_m]) == 'undefined') {\n        throw {\n                name: \"ArgumentError\", \n                message : 'pack method not available : ' + par.id + \" : \" + par + '.' +  pack_m +\n                        \"ADDING : \" + item.id + \" \" +  el\n                    \n\t    };\n\n        return;\n    }\n    \n    console.dump(args);\n    args.unshift(el);\n    //if (XObject.debug) print(pack_m + '[' + args.join(',') +']');\n    //Seed.print('args: ' + args.length);\n    if (pack_m) {\n        par[pack_m].apply(par, args);\n    }\n    \n    var _this = this;\n    item.items = item.items || [];\n    item.items.forEach(function(ch,n) {\n\n          print (\"type:\" + type);\n          \n           print (\"ch.pack:\" + ch.pack);\n         if (type == 'Gtk.Table' && ch.pack == 'add') {\n            var c = n % item.n_columns;\n            var r = Math.floor(n/item.n_columns);\n            ch.pack = [ 'attach', c, c+1, r, r+1, \n                     typeof(ch.x_options) == 'undefined' ?  5 : ch.x_options,\n                        typeof(ch.y_options) == 'undefined' ?  5 : ch.y_options,\n                        typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding,\n                        typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding\n            ].join(',');\n        }\n    \n        _this.viewAdd(ch, el);\n    });\n    \n    \n    \n    // add the signal handlers.\n    // is it a widget!?!!?\n   \n    \n    try {\n         \n        \n        el.signal.expose_event.connect(XObject.createDelegate(this.widgetExposeEvent, this, [ item  ], true));\n        el.signal.drag_motion.connect(XObject.createDelegate(this.widgetDragMotionEvent, this,[ item  ], true));\n        el.signal.drag_drop.connect(XObject.createDelegate(this.widgetDragDropEvent, this, [ item  ], true));\n        el.signal.button_press_event.connect(XObject.createDelegate(this.widgetPressEvent, this, [ item  ], true ));\n  el.signal.button_release_event.connect(XObject.createDelegate(this.widgetReleaseEvent, this, [ item  ], true ));\n    } catch(e) {\n        // ignore!\n       }\n    \n    \n    \n    return el;\n    \n}",
+                                                                            "|widgetDragDropEvent": "function() {\n      print(\"WIDGET DRAGDROP\"); \n            return true;\n}\n",
+                                                                            "|widgetDragMotionEvent": "function() {\n     print(\"WIDGET DRAGMOTION\"); \n            return true;\n}\n",
+                                                                            "|widgetExposeEvent": "function(w, evt, ud, item) {\n    var widget = w;\n     if (this.inRender) {\n         return false;\n     }\n     \n     if ( this.highlightWidget) {\n          this.inRender = true;\n          if (item.xtreepath.substring(0, this.activePath.length) == this.activePath) {\n                 Gdk.draw_rectangle(this.highlightWidget.window, this.gc, false, this.box.x , this.box.y, this.box.w, this.box.h);\n            }\n           this.inRender = false;\n           return false;\n     }\n     \n     \n     if (this.activePath != item.xtreepath) {\n        return false;\n     }\n     \n   //  print(\"HIGHLIGHT: \" + item.xtreepath ); // draw highlight??\n     // work out the coords of the window..\n     if (!this.gc) {\n      var dr = widget.window;\n      this.gc = (new Gdk.GC.c_new(dr));\n      this.gc.set_rgb_fg_color(new Gdk.Color({ red: 0xFFFF, green: 0, blue : 0 }));\n      this.gc.set_line_attributes(4,  Gdk.LineStyle.SOLID, Gdk.CapStyle.ROUND , Gdk.JoinStyle.ROUND);\n    }\n\n    \n     var r  = evt.expose.area;\n     // console.dump([r.x, r.y, r.width, r.height ] );\n     //return false;\n//     print(widget.get_parent().toString().match(/GtkScrolledWindow/);\n     if (widget.get_parent().toString().match(/GtkScrolledWindow/)) { // eak\n         // happens with gtkscrollview embedded stuff..\n         var np =this.activePath.split(':');\n         np.pop();\n         this.activePath = np.join(':');\n         this.renderedEl.queue_draw();\n         return true;\n\n        \n     }\n\n       \n     \n     \n      this.box = {\n        x : r.x - 2,\n        y : r.y - 2,\n        w: r.width + 4,\n        h: r.height + 4\n      }; \n      // let's draw it..\n      this.inRender = true;\n\n      \n      this.highlightWidget = widget;\n    \n    \n \n\n    //  print(\"DRAW BOX\");\n       //console.dump(this.box);\n      Gdk.draw_rectangle(widget.window, this.gc, false, this.box.x , this.box.y, this.box.w,this.box.h);\n            this.inRender = false;\n            return false;\n}\n",
+                                                                            "|widgetPressEvent": "function(w,e,u,d) {\n     if (this.get('view').pressed) {\n        return false;\n     }\nthis.get('view').pressed = true;\n      print(\"WIDGET PRESS \" + d.xtreepath );       \n          this.get('/LeftTree.view').selectNode(   d.xtreepath );        \n            return false;\n}\n",
+                                                                            "|widgetReleaseEvent": "function() {\n    this.get('view').pressed = false;\n   return false;\n}\n",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "HBox",
+                                                                                    "pack": "pack_start,false,true,0",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "Button",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "label": "Run The Application",
+                                                                                            "listeners": {
+                                                                                                "button_press_event": "function (self, event) {\n    // call render on left tree - with special option!?!\n \n    //print(\"GET PROEJCT\");\n    var pr = this.get('/LeftProjectTree').getActiveProject();\n  \n    var dir = '';\n    for (var i in pr.paths) { \n        dir = i;\n        break;\n    }\n    var runner = GLib.path_get_dirname (__script_path__) + '/gtkrun.js'; \n    this.get('/Terminal').feed(\"RUN DIR:\" + dir);\n    \n    this.get('/Terminal').el.fork_command( null , [], [], GLib.path_get_dirname (__script_path__) \n\t, false,false,false); \n    var cmd = \"/usr/bin/seed \" + runner + \" \" + dir + \"\\n\";\n    this.get('/Terminal').el.feed_child(cmd, cmd.length);\n    return false;\n  \n\n}"
+                                                                                            }
+                                                                                        }
+                                                                                    ]
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "ScrolledWindow",
+                                                                                    "pack": "add",
+                                                                                    "id": "view-sw",
+                                                                                    "|shadow_type": "Gtk.ShadowType.IN",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n}\n",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "EventBox",
+                                                                                            "pack": "add_with_viewport",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\nthis.el.modify_bg(Gtk.StateType.NORMAL, new Gdk.Color({\n            red: 0x9F00, green: 0xB800 , blue : 0xA800\n           }));\n} \n",
+                                                                                            "items": [
+                                                                                                {
+                                                                                                    "|xns": "Gtk",
+                                                                                                    "xtype": "Fixed",
+                                                                                                    "pack": "add",
+                                                                                                    "|init": "function() {\n\tXObject.prototype.init.call(this);\n\t//this.el.set_hadjustment(this.parent.el.get_hadjustment());\n\t//this.el.set_vadjustment(this.parent.el.get_vadjustment());\n \n}\n",
+                                                                                                    "items": [
+                                                                                                        {
+                                                                                                            "|xns": "Gtk",
+                                                                                                            "xtype": "EventBox",
+                                                                                                            "pack": "put,10,10",
+                                                                                                            "|init": "function() {\n\t//this.el =     new Gtk.Image.from_stock (Gtk.STOCK_HOME,  Gtk.IconSize.MENU);\n\tXObject.prototype.init.call(this);\n\n            Gtk.drag_dest_set\n            (\n                    this.el,              /* widget that will accept a drop */\n                    Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,\n                    null,            /* lists of target to support */\n                    0,              /* size of list */\n                    Gdk.DragAction.COPY         /* what to do with data after dropped */\n            );\n            \n           // print(\"RB: TARGETS : \" + LeftTree.atoms[\"STRING\"]);\n            Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);\n}\n",
+                                                                                                            "ready": false,
+                                                                                                            "|getActiveNode": "function(x,y)\n{\n   // workout what node is here..\n    return '0'; // top..\n}",
+                                                                                                            "id": "view",
+                                                                                                            "listeners": {
+                                                                                                                "drag_motion": "function (self, ctx, x, y, time) {\n    \n                // A) find out from drag all the places that node could be dropped.\n                var src = Gtk.drag_get_source_widget(ctx);\n                if (!src.dropList) {\n                    Gdk.drag_status(ctx, 0, time);\n                    return true;\n                }\n                // b) get what we are over.. (from activeNode)\n                // tree is empty.. - list should be correct..\n                if (!this.get('/LeftTree.model').currentTree) {\n                    Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n                    return true;\n                    \n                }\n                // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)\n                var activeNode = this.getActiveNode(x, y);\n                \n                \n                var tg = this.get('/LeftTree.model').findDropNode(activeNode, src.dropList);\n                console.dump(tg);\n                if (!tg.length) {\n                    Gdk.drag_status(ctx, 0,time);\n                    this.get('/LeftTree.view').highlight(false);\n                    return true;\n                }\n                 \n                // if we have a target..\n                // -> highlight it! (in browser)\n                // -> highlight it! (in tree)\n                \n                Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n                this.get('/LeftTree.view').highlight(tg);\n                this.targetData = tg;\n                // for tree we should handle this...\n                return true;\n}",
+                                                                                                                "drag_drop": "function (self,ctx, x, y, time) {\n\tSeed.print(\"TARGET: drag-drop\");\n        var is_valid_drop_site = true;\n        \n         \n        Gtk.drag_get_data\n        (\n                self,         /* will receive 'drag-data-received' signal */\n                ctx,        /* represents the current state of the this.gDnD */\n                this.get('/Window').atoms[\"STRING\"],    /* the target type we want */\n                time            /* time stamp */\n        );\n        \n        \n        /* No target offered by source => error */\n       \n\n        return  is_valid_drop_site;\n  \n}",
+                                                                                                                "drag_data_received": "function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) \n    {\n        Seed.print(\"GtkView: drag-data-received\");\n        var delete_selection_data = false;\n        var dnd_success = false;\n        /* Deal with what we are given from source */\n        if( sel_data && sel_data.length ) {\n            \n            if (ctx.action == Gdk.DragAction.ASK)  {\n                /* Ask the user to move or copy, then set the ctx action. */\n            }\n\n            if (ctx.action == Gdk.DragAction.MOVE) {\n                delete_selection_data = true;\n            }\n            var source = Gtk.drag_get_source_widget(ctx);\n\n            Seed.print(\"Browser: source.DRAGDATA? \" + source.dragData);\n            if (this.targetData) {\n                Seed.print(this.targetData);\n                this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);\n            }\n            \n            \n            \n            dnd_success = true;\n\n        }\n\n        if (dnd_success == false)\n        {\n                Seed.print (\"DnD data transfer failed!\\n\");\n        }\n        \n        Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);\n        return true;\n    }",
+                                                                                                                "button_press_event": "function (self, event) {\n  this.pressed = false;\n    return false;\n}"
+                                                                                                            }
+                                                                                                        }
+                                                                                                    ]
+                                                                                                }
+                                                                                            ]
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "id": "Help",
+                                                                    "pack": "add",
+                                                                    "xtype": "ScrolledWindow",
+                                                                    "|show": "function() {\n    \n    var file = this.get('/LeftTree').getActiveFile();\n    if (!file) {\n        return;\n    }\n    var activeEl = this.get('/LeftTree').getActiveElement();\n    var xtype = file.guessName( activeEl )\n    if (!xtype || !xtype.length) {\n        return;\n    }\n    //this.get('/Window.view-help-nb').el.set_current_page(1);\n    \n    // get the active element being edited.\n    var helpurl = file.getHelpUrl(xtype);       \n    \n    // now load the help info in the page..\n    this.get('help-view').el.open(helpurl);\n}\n",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "WebKit",
+                                                                            "xtype": "WebView",
+                                                                            "pack": "add",
+                                                                            "id": "help-view",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.get('/Window.help-view').el.open(\n     \"http://devel.akbkhome.com/seed/\");\n\n}\n",
+                                                                            "zoom_level": 0.8
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    "id": "BottomPane",
+                                                    "pack": "add",
+                                                    "xtype": "Notebook",
+                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n\t//this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Code Editor\" }));\n    \tthis.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Console\" }));\n    \tthis.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : \"Inspector\" }));\n}\n",
+                                                    "|xns": "Gtk",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "ScrolledWindow",
+                                                            "pack": "add",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Vte",
+                                                                    "xtype": "Terminal",
+                                                                    "pack": "add",
+                                                                    "id": "Terminal",
+                                                                    "|feed": "function(istr) {\n    var str = istr.replace(/\\n/g, \"\\r\\n\") + \"\\r\\n\";\n    // we should make ourselves visable!!!\n    this.get('/BottomPane').el.show();\n    this.get('/BottomPane').el.set_current_page(1);\n\n    this.el.feed(str ,str.length);\n}\n",
+                                                                    "|scroll_on_output": true,
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_size (80, 1000);\n}\n",
+                                                                    "scrollback_lines": 1000
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "xtype": "ScrolledWindow",
+                                                            "|xns": "Gtk",
+                                                            "pack": "add",
+                                                            "listeners": {},
+                                                            "items": [
+                                                                {
+                                                                    "id": "inspector",
+                                                                    "pack": "add",
+                                                                    "xtype": "WebView",
+                                                                    "|xns": "WebKit"
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "VBox",
+                                            "pack": "pack_start,false,false",
+                                            "id": "RightPalete",
+                                            "|hide": "function() {\n    \n      this.get('buttonbar').el.show();\n       this.get('viewbox').el.hide();\n    print(\"TRIED TO HIDE\");\n}\n",
+                                            "|show": "function() {\n    this.get('buttonbar').el.hide();\n    this.get('viewbox').el.show();\n   // this.get('model').expanded();\n            \n}\n",
+                                            "provider": false,
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "pack": "add",
+                                                    "id": "buttonbar",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "Button",
+                                                            "pack": "pack_start,false,true",
+                                                            "listeners": {
+                                                                "clicked": "function (self) {\n\tthis.get('/RightPalete').show();\n}"
+                                                            },
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Image",
+                                                                    "pack": "add",
+                                                                    "|stock": "Gtk.STOCK_GOTO_FIRST",
+                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "Label",
+                                                            "pack": "add",
+                                                            "label": "Palete",
+                                                            "angle": 270,
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.add_events ( Gdk.EventMask.BUTTON_MOTION_MASK );\n}\n",
+                                                            "listeners": {
+                                                                "enter_notify_event": "function (self, event) {\n    this.get('/RightPalete').show();\n    return false;\n}"
+                                                            }
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "pack": "add",
+                                                    "id": "viewbox",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "HBox",
+                                                            "pack": "pack_start,false,true",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Label",
+                                                                    "pack": "add",
+                                                                    "label": "Palete"
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Button",
+                                                                    "pack": "pack_start,false,true",
+                                                                    "listeners": {
+                                                                        "clicked": "function (self) {\n\tthis.get('/RightPalete').hide();\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "Image",
+                                                                            "pack": "add",
+                                                                            "|stock": "Gtk.STOCK_GOTO_LAST",
+                                                                            "|icon_size": "Gtk.IconSize.MENU"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "ScrolledWindow",
+                                                            "pack": "add",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n    this.el.set_size_request(-1,200);\n}\n",
+                                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "TreeView",
+                                                                    "pack": "add",
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n  this.el.set_size_request(150,-1);\n                          //  set_reorderable: [1]\n                                  \n            var description = new Pango.FontDescription.c_new();\n    description.set_size(8000);\n    this.el.modify_font(description);\n    \n    this.selection = this.el.get_selection();\n    this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n   // this.selection.signal['changed'].connect(function() {\n    //    _view.listeners['cursor-changed'].apply(_view, [ _view, '']);\n    //});\n    // see: http://live.gnome.org/GnomeLove/DragNDropTutorial\n     \n    Gtk.drag_source_set (\n            this.el,            /* widget will be drag-able */\n            Gdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */\n            null,            /* lists of target to support */\n            0,              /* size of list */\n            Gdk.DragAction.COPY         /* what to do with data after dropped */\n    );\n    //Gtk.drag_source_set_target_list(this.el, LeftTree.targetList);\n   \n    Gtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);\n    Gtk.drag_source_add_text_targets(this.el); \n    /*\n    print(\"RP: TARGET:\" + LeftTree.atoms[\"STRING\"]);\n    targets = new Gtk.TargetList();\n    targets.add( LeftTree.atoms[\"STRING\"], 0, 0);\n    targets.add_text_targets( 1 );\n    Gtk.drag_dest_set_target_list(this.el, LeftTree.targetList);\n    \n    //if you want to allow text to be output elsewhere..\n    //Gtk.drag_source_add_text_targets(this.el);\n    */\n    return true; \n}\n",
+                                                                    "|headers_visible": false,
+                                                                    "|enable_tree_lines": true,
+                                                                    "listeners": {
+                                                                        "drag_begin": "function (self, ctx) {\n    // we could fill this in now...\n        Seed.print('SOURCE: drag-begin');\n        \n        \n        \n        var iter = new Gtk.TreeIter();\n        var s = this.selection;\n        s.get_selected(this.get('/RightPalete.model').el, iter);\n        var path = this.get('/RightPalete.model').el.get_path(iter);\n        \n        var pix = this.el.create_row_drag_icon ( path);\n            \n                \n        Gtk.drag_set_icon_pixmap (ctx,\n            pix.get_colormap(),\n            pix,\n            null,\n            -10,\n            -10);\n        \n        var value = new GObject.Value('');\n        this.get('/RightPalete.model').el.get_value(iter, 0, value);\n        if (!this.get('/RightPalete').provider) {\n            return false;\n        }\n        this.el.dropList = this.get('/RightPalete').provider.getDropList(value.value);\n        this.el.dragData = value.value;\n        \n        \n        \n        \n        return true;\n}",
+                                                                        "drag_data_get": "function (self, drag_context, selection_data, info, time) {\n \t//Seed.print('Palete: drag-data-get: ' + target_type);\n        if (this.el.dragData && this.el.dragData.length ) {\n            selection_data.set_text(this.el.dragData ,this.el.dragData.length);\n        }\n        \n        \n        //this.el.dragData = \"TEST from source widget\";\n        \n        \n}",
+                                                                        "drag_end": "function (self, drag_context) {\n \tSeed.print('SOURCE: drag-end');\n\tthis.el.dragData = false;\n\tthis.el.dropList = false;\n\tthis.get('/LeftTree.view').highlight(false);\n\treturn true;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "ListStore",
+                                                                            "pack": "set_model",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\nthis.el.set_column_types ( 2, [\n                            GObject.TYPE_STRING, // title \n                            GObject.TYPE_STRING // tip\n                            \n                            ] );\n}\n",
+                                                                            "id": "model",
+                                                                            "|load": "function(tr,iter)\n{\n    if (!iter) {\n        this.el.clear();\n    }\n    //console.log('Project tree load: ' + tr.length);\n    var citer = new Gtk.TreeIter();\n    //this.insert(citer,iter,0);\n    for(var i =0 ; i < tr.length; i++) {\n        if (!iter) {\n            \n            this.el.append(citer);   \n        } else {\n            this.el.insert(citer,iter,-1);\n        }\n        \n        var r = tr[i];\n        //Seed.print(r);\n        this.el.set_value(citer, 0,  '' +  r ); // title \n        \n        //this.el.set_value(citer, 1,  new GObject.Value( r)); //id\n        //if (r.cn && r.cn.length) {\n        //    this.load(r.cn, citer);\n        //}\n    }\n    \n    \n}",
+                                                                            "|getValue": "function (iter, col) {\n    var gval = new GObject.Value('');\n     this.el.get_value(iter, col ,gval);\n    return  gval.value;\n    \n    \n}"
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "TreeViewColumn",
+                                                                            "pack": "append_column",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.add_attribute(this.items[0].el , 'markup', 0 );\n}\n",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "CellRendererText",
+                                                                                    "pack": "pack_start"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                }
+            ]
+        }
+    ],
+    "permname": ""
+}
\ No newline at end of file

diff --git a/Builder/Window.js b/Builder/Window.js
new file mode 100644 (file)
index 0000000..ee270cf
--- /dev/null
+++ b/Builder/Window.js
@@ -0,0 +1,4061 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+Window=new XObject({
+    xtype: Gtk.Window,
+    listeners : {
+        delete_event : function (self, event) {
+            return false;
+        },
+        destroy : function (self) {
+           Gtk.main_quit();
+        },
+        show : function (self) {
+          print("WINDOW SHOWING - trying to hide");
+        imports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();
+               this.get('/MidPropTree').hideWin();
+            this.get('/RightPalete').hide();
+            this.get('/BottomPane').el.hide();
+            //this.get('/Editor').el.show_all();
+        
+        }
+    },
+    border_width : 0,
+    default_height : 500,
+    default_width : 800,
+    id : "Window",
+    title : "Application Builder",
+    init : function() {
+         this.atoms = {
+               "STRING" : Gdk.atom_intern("STRING")
+       };
+       this.targetList = new Gtk.TargetList();
+       this.targetList.add( this.atoms["STRING"], 0, 0);
+       //imports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();
+    Gtk.rc_parse_string(
+                "style \"gtkcombobox-style\" {\n" + 
+                "    GtkComboBox::appears-as-list = 1\n" +
+                "}\n"+
+                "class \"GtkComboBox\" style \"gtkcombobox-style\"\n");
+        XObject.prototype.init.call(this);
+        this.el.show_all();
+        
+       
+                  
+    },
+    setTitle : function(str) {
+        this.el.set_title(this.title + ' - ' + str);
+    },
+    type : Gtk.WindowType.TOPLEVEL,
+    items : [
+        {
+            xtype: Gtk.VBox,
+            id : "w-vbox",
+            items : [
+                {
+                    xtype: Gtk.MenuBar,
+                    pack : "pack_start,false,false",
+                    items : [
+                        {
+                            xtype: Gtk.MenuItem,
+                            use_underline : true,
+                            label : "_File",
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            use_underline : true,
+                                            label : "New _Project",
+                                            listeners : {
+                                                activate : function (self) {
+                                                         var _this = this;
+                                                       this.get('/EditProject').show({
+                                                           success : function(pr) {
+                                                                    _this.get('/LeftProjectTree').get('combo').setValue(pr.fn);
+                                                           }
+                                                       });
+                                                }
+                                            }
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            label : "_New File",
+                                            use_underline : true,
+                                            listeners : {
+                                                activate : function (self) {
+                                                       var fn = this.get('/LeftProjectTree.combo').getValue();
+                                                        if (!fn) {
+                                                            this.get('/LeftProjectTree').showNoProjectSelected();
+                                                            return true;
+                                                        }
+                                                        var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                        this.get('/DialogNewComponent').show({
+                                                            project : pm.getByFn(fn)
+                                                        });
+                                                }
+                                            }
+                                        },
+                                        {
+                                            xtype: Gtk.SeparatorMenuItem,
+                                            pack : "add"
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            use_underline : true,
+                                            pack : "add",
+                                            label : "D_elete Project",
+                                            listeners : {
+                                                activate : function (self) {
+                                                
+                                                       var fn =  this.get('/LeftProjectTree').get('combo').getValue();
+                                                       if (!fn.length) {
+                                                               this.get('/StandardErrorDialog').show("Select a project")
+                                                               return;
+                                                        }
+                                                       var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                       var pr  = pm.getByFn(fn);
+                                                
+                                                       // confirm..
+                                                       this.get('/DialogConfirm').show("Are you sure you want to delete project '" + pr.name + "'", function() {
+                                                               pm.deleteProject(fn);
+                                                               print("DELETE?");
+                                                       });
+                                                
+                                                }
+                                            }
+                                        },
+                                        {
+                                            xtype: Gtk.SeparatorMenuItem,
+                                            pack : "add"
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            pack : "add",
+                                            label : "_Quit",
+                                            use_underline : true,
+                                            listeners : {
+                                                activate : function (self) {
+                                                   Gtk.main_quit();
+                                                }
+                                            }
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.MenuItem,
+                            label : "_Edit",
+                            use_underline : true,
+                            pack : "add",
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self) {
+                                                       var fn = this.get('/LeftTree').getActiveFile();
+                                                        if (!fn) {
+                                                            this.get('/StandardErrorDialog').show("No File active");
+                                                            return true;
+                                                        }
+                                                 
+                                                        this.get('/DialogNewComponent').show(fn);
+                                                        return true;
+                                                }
+                                            },
+                                            label : "File _Properties",
+                                            pack : "add",
+                                            use_underline : true
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self, event) {
+                                                    this.get('/RooProjectProperties').show();
+                                                    return false;
+                                                }
+                                            },
+                                            label : "Modify Project HTML ",
+                                            pack : "add",
+                                            use_underline : true
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.MenuItem,
+                            label : "_View",
+                            use_underline : true,
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self, event) {
+                                                      var js = this.get('/LeftTree.model').toJS();
+                                                    if (js && js[0]) {
+                                                        this.get('/RightBrowser.view').renderJS(js[0], true);
+                                                    } 
+                                                    return false;
+                                                }
+                                            },
+                                            label : "_Redraw (Roo)",
+                                            pack : "add",
+                                            use_underline : true
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self, event) 
+                                                {
+                                                        /* Firefox testing for debugging..
+                                                          - we can create a /tmp directory, and put.
+                                                            builder.html, builder.html.js, link roojs1 
+                                                            add at the end of builder.html Roo.onload(function() {
+                                                         */
+                                                        if (!this.get('/Window.LeftTree').getActiveFile()) {
+                                                            return;
+                                                        }
+                                                        
+                                                        var js = this.get('/LeftTree.model').toJS();
+                                                         if (!js ||  !js[0]) {
+                                                            return;
+                                                        }
+                                                        var project = this.get('/Window.LeftTree').getActiveFile().project;
+                                                        //print (project.fn);
+                                                        
+                                                        project.runhtml  = project.runhtml || '';
+                                                
+                                                
+                                                       var File = imports.File.File;
+                                                       
+                                                       var target = "/tmp/firetest"; // fixme..
+                                                       if (!File.isDirectory(target)) {
+                                                           File.mkdir(target);
+                                                        }
+                                                       File.copy(__script_path__ + '/../builder.html.js', target+ '/builder.html.js', Gio.FileCopyFlags.OVERWRITE);
+                                                       if (!File.exists( target+ '/roojs1')) {
+                                                            File.link( target+ '/roojs1', __script_path__ + '/../roojs1');
+                                                       }
+                                                        
+                                                        
+                                                        
+                                                        var html = imports.File.File.read(__script_path__ + '/../builder.html');
+                                                        html = html.replace('</head>', project.runhtml + '</head>');
+                                                        
+                                                       
+                                                        var     jsstr = JSON.stringify(js[0], null, 4);
+                                                       
+                                                        var runbuilder = '<script type="text/javascript">' + "\n" + 
+                                                            " Builder.render(" + jsstr + ");\n" +
+                                                            '</script>';
+                                                        
+                                                        html = html.replace('</body>', runbuilder + '</body>');
+                                                
+                                                       File.write( target+ '/builder.html', html);
+                                                       
+                                                        this.get('/Terminal').feed("RUN DIR:" + target);
+                                                    
+                                                    this.get('/Terminal').el.fork_command( null , [], [], target
+                                                       , false,false,false); 
+                                                    var cmd = "firefox file://" + target + "/builder.html  \n";
+                                                    this.get('/Terminal').el.feed_child(cmd, cmd.length);
+                                                     return false;
+                                                }
+                                            },
+                                            label : "_Test in Firefox (Roo)",
+                                            pack : "add",
+                                            use_underline : true
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.MenuItem,
+                            label : "_Help",
+                            use_underline : true,
+                            pack : "add",
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            pack : "add",
+                                            label : "_About",
+                                            use_underline : true,
+                                            listeners : {
+                                                activate : function (self) {
+                                                    this.get('/About').el.run();
+                                                }
+                                            }
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                },
+                {
+                    xtype: Gtk.HPaned,
+                    id : "left",
+                    position : 400,
+                    items : [
+                        {
+                            xtype: Gtk.HBox,
+                            items : [
+                                {
+                                    xtype: Gtk.VPaned,
+                                    position : 300,
+                                    id : "leftvpaned",
+                                    items : [
+                                        {
+                                            xtype: Gtk.VBox,
+                                            id : "LeftTopPanel",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.Expander,
+                                                    listeners : {
+                                                        activate : function (self) {
+                                                            // this does not actually expand it..
+                                                            // that is done by GTK..
+                                                            
+                                                            
+                                                        
+                                                            if (!this.el.expanded) {
+                                                                this.onExpand();
+                                                            } else {
+                                                                this.onCollapse();
+                                                            }
+                                                                 
+                                                        },
+                                                        enter_notify_event : function (self, event) {
+                                                        return;
+                                                             this.el.expanded = !this.el.expanded;
+                                                        //if (this.el.expanded ) {
+                                                            this.listeners.activate.call(this);
+                                                        //   }
+                                                        
+                                                        return true;
+                                                        }
+                                                    },
+                                                    id : "expander",
+                                                    label : "Select Project or File",
+                                                    pack : "pack_start,false,true",
+                                                    onCollapse : function() {
+                                                        
+                                                        var nb = this.get('/LeftTopPanel.notebook');
+                                                        nb.el.set_current_page(0);
+                                                    },
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.add_events (Gdk.EventMask.BUTTON_MOTION_MASK );
+                                                    },
+                                                    onExpand : function() {
+                                                        var nb = this.get('/LeftTopPanel.notebook');            
+                                                        var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                        
+                                                       
+                                                        var model = this.get('/LeftProjectTree.combomodel');
+                                                        //  print ("loading Projects?")
+                                                        //console.dump(pm.projects);
+                                                        model.loadData(pm.projects);
+                                                         
+                                                        
+                                                        nb.el.set_current_page(1);
+                                                        //pm.on('changed', function() {
+                                                       //console.log("CAUGHT project manager change");
+                                                        //    _combo.model.loadData(pm.projects);
+                                                        //}
+                                                        return;
+                                                    }
+                                                },
+                                                {
+                                                    xtype: Gtk.Notebook,
+                                                    id : "notebook",
+                                                    pack : "pack_start,true,true",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_current_page(0);
+                                                    
+                                                    },
+                                                    show_border : false,
+                                                    show_tabs : false,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.ScrolledWindow,
+                                                            id : "LeftTree",
+                                                            pack : "add",
+                                                            getActiveElement : function() { // return path to actie node.
+                                                            
+                                                                 var path = this.getActivePath();
+                                                                 if (!path) {
+                                                                    return false;
+                                                                 }
+                                                                 var iter = new Gtk.TreeIter();
+                                                                 this.get('model').el.get_iter_from_string(iter, path);
+                                                                 
+                                                                 var value = new GObject.Value('');
+                                                                 this.get('model').el.get_value(iter, 2, value);
+                                                                    
+                                                                 return JSON.parse(value.value);
+                                                            },
+                                                            getActiveFile : function() {
+                                                                return this.get('model').file;
+                                                            },
+                                                            getActivePath : function() {
+                                                                var model = this.get('model');
+                                                                var view = this.get('view');
+                                                                if (view.selection.count_selected_rows() < 1) {
+                                                                    return false;
+                                                                }
+                                                                var iter = new Gtk.TreeIter();
+                                                            
+                                                                view.selection.get_selected(model.el, iter);
+                                                                return model.el.get_path(iter).to_string();
+                                                            },
+                                                            getPaleteProvider : function() {
+                                                                var model = this.get('model');
+                                                                var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                                return pm.getPalete(model.file.getType());
+                                                            },
+                                                            getRenderer : function() {
+                                                            
+                                                               switch( this.getActiveFile().getType()) {
+                                                                       case 'Roo':
+                                                                           return this.get('/RightBrowser.view');
+                                                                       case 'Gtk':
+                                                                           return this.get('/RightGtkView');
+                                                               }
+                                                            
+                                                            },
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                                this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)
+                                                            },
+                                                            renderView : function() {
+                                                                var render = this.getRenderer();
+                                                                var model = this.get('model');
+                                                                if (render) {
+                                                                    render.renderJS(model.toJS(false,true)[0]);
+                                                                } else {
+                                                                    print("NO RENDER JS METHOD?");
+                                                                }
+                                                            },
+                                                            shadow_type : Gtk.ShadowType.IN,
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.TreeView,
+                                                                    listeners : {
+                                                                        button_press_event : function (self, ev) {
+                                                                               console.log("button press?");
+                                                                                if (ev.type != Gdk.EventType.BUTTON_PRESS  || ev.button.button != 3) {
+                                                                                    print("click" + ev.type);
+                                                                                    return false;
+                                                                                }
+                                                                              
+                                                                            
+                                                                                var res = {}; 
+                                                                                this.get('/LeftTree.view').el.get_path_at_pos(ev.button.x,ev.button.y, res);
+                                                                                
+                                                                                if (!this.get('/LeftTreeMenu').el)  this.get('/LeftTreeMenu').init();
+                                                                                
+                                                                                this.get('/LeftTreeMenu').el.set_screen(Gdk.Screen.get_default());
+                                                                                this.get('/LeftTreeMenu').el.show_all();
+                                                                                this.get('/LeftTreeMenu').el.popup(null, null, null, null, 3, ev.button.time);
+                                                                                print("click:" + res.path.to_string());
+                                                                                return false;
+                                                                        },
+                                                                        drag_begin : function (self, drag_context) {
+                                                                               print('SOURCE: drag-begin');
+                                                                                 this.targetData = false;
+                                                                                // find what is selected in our tree...
+                                                                                var iter = new Gtk.TreeIter();
+                                                                                var s = this.selection;
+                                                                                s.get_selected(this.get('/LeftTree.model').el, iter);
+                                                                        
+                                                                                // set some properties of the tree for use by the dropped element.
+                                                                                var value = new GObject.Value('');
+                                                                                this.get('/LeftTree.model').el.get_value(iter, 2, value);
+                                                                                var data = JSON.parse(value.value);
+                                                                                var xname = this.get('/LeftTree.model').file.guessName(data);
+                                                                                
+                                                                                this.el.dragData = xname;
+                                                                                this.el.dropList = this.get('/LeftTree').getPaleteProvider().getDropList(xname);
+                                                                                
+                                                                        
+                                                                                // make the drag icon a picture of the node that was selected
+                                                                                var path = this.get('/LeftTree.model').el.get_path(iter);
+                                                                                this.el.treepath = path.to_string();
+                                                                                
+                                                                                var pix = this.el.create_row_drag_icon ( path);
+                                                                                
+                                                                                Gtk.drag_set_icon_pixmap (ctx,
+                                                                                    pix.get_colormap(),
+                                                                                    pix,
+                                                                                    null,
+                                                                                    -10,
+                                                                                    -10);
+                                                                                
+                                                                                return true;
+                                                                        },
+                                                                        drag_end : function (self, drag_context) {
+                                                                               Seed.print('LEFT-TREE: drag-end');
+                                                                                this.el.dragData = false;
+                                                                                this.el.dropList = false;
+                                                                                this.targetData = false;
+                                                                                this.get('/LeftTree.view').highlight(false);
+                                                                                return true;
+                                                                        },
+                                                                        drag_motion : function (self, ctx, x, y, time) {
+                                                                            console.log("LEFT-TREE: drag-motion");
+                                                                                        var src = Gtk.drag_get_source_widget(ctx);
+                                                                        
+                                                                                        // a drag from  elsewhere...- prevent drop..
+                                                                                        if (!src.dragData) {
+                                                                                            print("no drag data!");
+                                                                                            Gdk.drag_status(ctx, 0, time);
+                                                                                            this.targetData = false;
+                                                                                            return true;
+                                                                                        }
+                                                                                        var action = Gdk.DragAction.COPY;
+                                                                                        if (src == this.el) {
+                                                                                            // unless we are copying!!! ctl button..
+                                                                                            action = ctx.actions & Gdk.DragAction.MOVE ? Gdk.DragAction.MOVE : Gdk.DragAction.COPY ;
+                                                                                        }
+                                                                                        var data = {};
+                                                                        
+                                                                                       if (!this.get('/LeftTree.model').el.iter_n_children(null)) {
+                                                                                               // no children.. -- asume it's ok..
+                                                                                               this.targetData =  [ '' , Gtk.TreeViewDropPosition.INTO_OR_AFTER , ''];
+                                                                                               Gdk.drag_status(ctx, action ,time);
+                                                                                               return true;
+                                                                                       }
+                                                                        
+                                                                                        print("GETTING POS");
+                                                                                        var isOver = this.get('/LeftTree.view').el.get_dest_row_at_pos(x,y, data);
+                                                                                        print("ISOVER? " + isOver);
+                                                                                        if (!isOver) {
+                                                                                            Gdk.drag_status(ctx, 0 ,time);
+                                                                                            return false; // not over apoint!?!
+                                                                                        }
+                                                                                        // drag node is parent of child..
+                                                                                        console.log("SRC TREEPATH: " + src.treepath);
+                                                                                        console.log("TARGET TREEPATH: " + data.path.to_string());
+                                                                                        
+                                                                                        // nned to check a  few here..
+                                                                                        //Gtk.TreeViewDropPosition.INTO_OR_AFTER
+                                                                                        //Gtk.TreeViewDropPosition.INTO_OR_BEFORE
+                                                                                        //Gtk.TreeViewDropPosition.AFTER
+                                                                                        //Gtk.TreeViewDropPosition.BEFORE
+                                                                                        
+                                                                                        if (typeof(src.treepath) != 'undefined'  && 
+                                                                                            src.treepath == data.path.to_string().substring(0,src.treepath.length)) {
+                                                                                            print("subpath drag");
+                                                                                             Gdk.drag_status(ctx, 0 ,time);
+                                                                                            return false;
+                                                                                        }
+                                                                                        
+                                                                                        // check that 
+                                                                                        //print("DUMPING DATA");
+                                                                                        //console.dump(data);
+                                                                                        // path, pos
+                                                                                        
+                                                                                        print(data.path.to_string() +' => '+  data.pos);
+                                                                                        var tg = this.get('/LeftTree.model').findDropNodeByPath(
+                                                                                            data.path.to_string(), src.dropList, data.pos);
+                                                                                            
+                                                                                        this.get('/LeftTree.view').highlight(tg);
+                                                                                        if (!tg.length) {
+                                                                                            print("Can not find drop node path");
+                                                                                            this.targetData = false;
+                                                                                            Gdk.drag_status(ctx, 0, time);
+                                                                                            return true;
+                                                                                        }
+                                                                                        //console.dump(tg);
+                                                                                        this.targetData = tg;    
+                                                                                        
+                                                                                        
+                                                                                        Gdk.drag_status(ctx, action ,time);
+                                                                                         
+                                                                                        return true;
+                                                                        },
+                                                                        drag_drop : function (w, ctx, x, y, time) {
+                                                                              Seed.print("TARGET: drag-drop");
+                                                                                               
+                                                                                                Gtk.drag_get_data
+                                                                                                (
+                                                                                                        w,         /* will receive 'drag-data-received' signal */
+                                                                                                        ctx,        /* represents the current state of the DnD */
+                                                                                                        this.get('/Window').atoms["STRING"],    /* the target type we want */
+                                                                                                        time            /* time stamp */
+                                                                                                );
+                                                                                                
+                                                                                                 
+                                                                                                /* No target offered by source => error */
+                                                                                               
+                                                                        
+                                                                                                return  true;
+                                                                        },
+                                                                        drag_data_received : function (self, ctx, x, y, sel_data, info, time) {
+                                                                                print("Tree: drag-data-received");
+                                                                        
+                                                                                      var   delete_selection_data = false;
+                                                                                       var  dnd_success = false;
+                                                                                        /* Deal with what we are given from source */
+                                                                                        if( sel_data && sel_data.length ) {
+                                                                                            
+                                                                                            if (ctx.action == Gdk.DragAction.ASK)  {
+                                                                                                /* Ask the user to move or copy, then set the ctx action. */
+                                                                                            }
+                                                                        
+                                                                                            if (ctx.action == Gdk.DragAction.MOVE) {
+                                                                                                //delete_selection_data = true;
+                                                                                            }
+                                                                                            
+                                                                                            var source = Gtk.drag_get_source_widget(ctx);
+                                                                        
+                                                                                            if (this.targetData) {
+                                                                                                if (source != this.el) {
+                                                                                                    this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);
+                                                                                                } else {
+                                                                                                    // drag around.. - reorder..
+                                                                                                     this.get('/LeftTree.model').moveNode(this.targetData, ctx.action);
+                                                                                                    
+                                                                                                    
+                                                                                                }
+                                                                                                //Seed.print(this.targetData);
+                                                                                              
+                                                                                            }
+                                                                                            
+                                                                                            
+                                                                                            
+                                                                                            // we can send stuff to souce here...
+                                                                        
+                                                                                            dnd_success = true;
+                                                                        
+                                                                                        }
+                                                                        
+                                                                                        if (dnd_success == false)
+                                                                                        {
+                                                                                                Seed.print ("DnD data transfer failed!\n");
+                                                                                        }
+                                                                        
+                                                                                        Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
+                                                                                        return true;
+                                                                        },
+                                                                        cursor_changed : function (self) {
+                                                                             if (this.blockChanges) { // probably not needed.. 
+                                                                               return true;
+                                                                             }
+                                                                             var render = this.get('/LeftTree').getRenderer();                
+                                                                           
+                                                                            
+                                                                            if (this.selection.count_selected_rows() < 1) {
+                                                                                this.get('/LeftPanel.model').load( false);
+                                                                                this.get('/MidPropTree').activeElement =  false;
+                                                                                this.get('/MidPropTree').hideWin();
+                                                                        
+                                                                                var pm = this.get('/RightPalete.model');
+                                                                                if (!this.get('/LeftTree').getPaleteProvider()) {
+                                                                                    // it may not be loaded yet..
+                                                                                    return  true;
+                                                                                }
+                                                                                pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(
+                                                                                    this.get('/LeftTree.model').listAllTypes()));
+                                                                                if (render && render.redraw) {
+                                                                                    render.redraw();
+                                                                                }
+                                                                                return true;
+                                                                            }
+                                                                                    
+                                                                                    //console.log('changed');
+                                                                                var s = this.selection;
+                                                                                  var iter = new Gtk.TreeIter();
+                                                                                s.get_selected(this.get('/LeftTree.model').el, iter);
+                                                                                
+                                                                                
+                                                                                // var val = "";
+                                                                                var value = new GObject.Value('');
+                                                                                this.get('/LeftTree.model').el.get_value(iter, 2, value);
+                                                                                this.get('/LeftTree.model').activePath = this.get('/LeftTree.model').el.get_path(iter).to_string();
+                                                                                
+                                                                                var data = JSON.parse(value.value);
+                                                                                this.get('/MidPropTree').activeElement =  data;
+                                                                                this.get('/MidPropTree').hideWin();
+                                                                                this.get('/LeftPanel.model').load( data);
+                                                                                
+                                                                                console.log(value.value);
+                                                                               // _g.button.set_label(''+value.get_string());
+                                                                        
+                                                                                var pm =this.get('/RightPalete.model');
+                                                                                pm.load(  this.get('/LeftTree').getPaleteProvider().gatherList(
+                                                                                     this.get('/LeftTree.model').listAllTypes()));
+                                                                               
+                                                                                
+                                                                                   if (render && render.redraw) {
+                                                                                    render.redraw();
+                                                                                }
+                                                                                   
+                                                                                    //Seed.print( value.get_string());
+                                                                                    return true;
+                                                                                        
+                                                                        }
+                                                                    },
+                                                                    id : "view",
+                                                                    pack : "add",
+                                                                    tooltip_column : 1,
+                                                                    enable_tree_lines : true,
+                                                                    headers_visible : false,
+                                                                    highlight : function(treepath_ar) {
+                                                                    
+                                                                            // highlighting for drag/drop
+                                                                            if (treepath_ar.length && treepath_ar[0].length ) {
+                                                                                this.el.set_drag_dest_row( 
+                                                                                        new  Gtk.TreePath.from_string( treepath_ar[0] ),  treepath_ar[1]);
+                                                                                } else {
+                                                                                    this.el.set_drag_dest_row(null, Gtk.TreeViewDropPosition.INTO_OR_AFTER);
+                                                                                }
+                                                                                 
+                                                                            },
+                                                                    init : function() {
+                                                                               XObject.prototype.init.call(this);
+                                                                       var description = new Pango.FontDescription.c_new();
+                                                                       description.set_size(8000);
+                                                                       this.el.modify_font(description);
+                                                                    
+                                                                       this.selection = this.el.get_selection();
+                                                                       this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                                       var _this = this;
+                                                                    
+                                                                       // is this really needed??
+                                                                       this.selection.signal['changed'].connect(function() {
+                                                                               _this.get('/LeftTree.view').listeners.cursor_changed.apply(
+                                                                                   _this.get('/LeftTree.view'), [ _this.get('/LeftTree.view'), '']
+                                                                               );
+                                                                       });
+                                                                    
+                                                                       Gtk.drag_source_set (
+                                                                               this.el,            /* widget will be drag-able */
+                                                                               Gdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */
+                                                                               null,            /* lists of target to support */
+                                                                               0,              /* size of list */
+                                                                               Gdk.DragAction.COPY   | Gdk.DragAction.MOVE           /* what to do with data after dropped */
+                                                                       );
+                                                                    
+                                                                       Gtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);
+                                                                    
+                                                                       Gtk.drag_source_add_text_targets(this.el); 
+                                                                       Gtk.drag_dest_set
+                                                                       (
+                                                                           this.el,              /* widget that will accept a drop */
+                                                                           Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,
+                                                                           null,            /* lists of target to support */
+                                                                           0,              /* size of list */
+                                                                           Gdk.DragAction.COPY   | Gdk.DragAction.MOVE       /* what to do with data after dropped */
+                                                                       );
+                                                                    
+                                                                       Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);
+                                                                       Gtk.drag_dest_add_text_targets(this.el);
+                                                                    },
+                                                                    selectNode : function(treepath_str) {
+                                                                        //this.selection.select_path(new  Gtk.TreePath.from_string( treepath_str));
+                                                                     var tp = new Gtk.TreePath.from_string(treepath_str);
+                                                                              this.el.set_cursor(tp, null, false);  
+                                                                          this.el.scroll_to_cell(tp, null, false, 0,0);
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.TreeStore,
+                                                                            activePath : false,
+                                                                            currentTree : false,
+                                                                            id : "model",
+                                                                            pack : "set_model",
+                                                                            changed : function(n, refresh) {
+                                                                                //     print("MODEL CHANGED CALLED" + this.activePath);
+                                                                                     if (this.activePath) {
+                                                                                        var iter = new Gtk.TreeIter();
+                                                                                        this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath))
+                                                                                        this.el.set_value(iter, 0, [GObject.TYPE_STRING, this.nodeTitle(n)]);
+                                                                                        this.el.set_value(iter, 1, [GObject.TYPE_STRING, this.nodeTitle(n)]);
+                                                                                        
+                                                                                        this.el.set_value(iter, 2, [GObject.TYPE_STRING, this.nodeToJSON(n)]);
+                                                                                    }
+                                                                                        //this.currentTree = this.toJS(false, true)[0];
+                                                                                    var d = new Date();
+                                                                                    this.file.items = this.toJS(false, false);
+                                                                                    print ("TO JS in " + ((new Date()) - d) + "ms");
+                                                                                  //  print("AFTER CHANGED");
+                                                                                    //console.dump(this.file.items);
+                                                                                    this.file.save();
+                                                                                    this.currentTree = this.file.items[0];
+                                                                                    //console.log(this.file.toSource());
+                                                                                    
+                                                                                    if (refresh) {
+                                                                                        print("REDNER BROWSER?!");
+                                                                                        this.get('/LeftTree').renderView();
+                                                                            
+                                                                                        var pm = this.get('/RightPalete.model');
+                                                                                        if (!this.get('/RightPalete').provider) {
+                                                                                            pm.load([]);
+                                                                                            return;
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        pm.load( this.get('/RightPalete').provider.gatherList(this.listAllTypes()));
+                                                                                        //imports['Builder/RightBrowser.js'].renderJS(this.toJS());
+                                                                                    }
+                                                                                         
+                                                                            },
+                                                                            deleteSelected : function() {
+                                                                                this.get('/LeftTree.view').blockChanges = true;
+                                                                                var old_iter = new Gtk.TreeIter();
+                                                                                var s = this.get('/LeftTree.view').selection;
+                                                                                s.get_selected(this.el, old_iter);
+                                                                                var path = this.el.get_path(old_iter).to_string();
+                                                                            
+                                                                                this.activePath= false;      
+                                                                                s.unselect_all();
+                                                                            
+                                                                                this.activePath= false;      
+                                                                                 var iter = new Gtk.TreeIter();
+                                                                                this.el.get_iter_from_string(iter, path);
+                                                                                this.el.remove(iter);
+                                                                                
+                                                                                // rebuild treemap. -- depreciated.!!
+                                                                                this.map = {};
+                                                                                this.treemap = { };
+                                                                                //this.toJS(null, true) // does not do anything?
+                                                                                this.activePath= false;      
+                                                                                this.changed(false,true);
+                                                                                this.get('/LeftTree.view').blockChanges = false;
+                                                                            },
+                                                                            dropNode : function(target_data, node) {
+                                                                                     print("drop Node");
+                                                                                 // console.dump(node);
+                                                                              //    console.dump(target_data);
+                                                                                    var tp = target_data[0].length ? new  Gtk.TreePath.from_string( target_data[0] ) : false;
+                                                                                    
+                                                                                    print("add " + tp + "@" + target_data[1]  );
+                                                                                    var parent = tp;
+                                                                                    var after = false;
+                                                                                    if (tp && target_data[1]  < 2) { // before or after..
+                                                                                        var ar = target_data[0].split(':');
+                                                                                        ar.pop();
+                                                                                        parent  = new  Gtk.TreePath.from_string( ar.join(':') );
+                                                                                        after = tp;
+                                                                                    }
+                                                                                    var n_iter = new Gtk.TreeIter();
+                                                                                    var iter_par = new Gtk.TreeIter();
+                                                                                    var iter_after = after ? new Gtk.TreeIter() : false;
+                                                                                    
+                                                                                    
+                                                                                    
+                                                                                    if (parent !== false) {
+                                                                                        this.el.get_iter(iter_par, parent);
+                                                                                    } else {
+                                                                                        iter_par = null;
+                                                                                    }
+                                                                                    
+                                                                                    
+                                                                                    if (tp && after) {
+                                                                                        print(target_data[1]  > 0 ? 'insert_after' : 'insert_before');
+                                                                                        this.el.get_iter(iter_after, after);
+                                                                                        this.el[ target_data[1]  > 0 ? 'insert_after' : 'insert_before'](
+                                                                                                n_iter, iter_par, iter_after);
+                                                                                        
+                                                                                    } else {
+                                                                                        this.el.append(n_iter, iter_par);
+                                                                                        
+                                                                                    }
+                                                                                    
+                                                                                    if (typeof(node) == 'string') {
+                                                                                        var ar = node.split('.');
+                                                                                        var xtype = ar.pop();
+                                                                                        
+                                                                                        node = {
+                                                                                            '|xns' : ar.join('.'),
+                                                                                            'xtype' : xtype
+                                                                                        };
+                                                                                        if (target_data.length == 3 && target_data[2].length) {
+                                                                                            node['*prop'] = target_data[2];
+                                                                                        }
+                                                                                        node = this.get('/DialogTemplateSelect').show(node);
+                                                                                        
+                                                                                    }
+                                                                                    // work out what kind of packing to use..
+                                                                                    if (typeof(node.pack) == 'undefined'  && parent !== false) {
+                                                                                        var pal = this.get('/LeftTree').getPaleteProvider();
+                                                                                        if (pal.name == 'Gtk') {
+                                                                                            var pname = pal.guessName(this.singleNodeToJS(parent.to_string()));
+                                                                                            var cname = pal.guessName(node);
+                                                                                            node.pack = pal.getDefaultPack(pname, cname);
+                                                                                        }
+                                                                                        
+                                                                                    }
+                                                                                    
+                                                                                    
+                                                                                    var xitems = [];
+                                                                                    if (node.items) {
+                                                                                        xitems = node.items;
+                                                                                        delete node.items;
+                                                                                    }
+                                                                            // load children - if it has any..
+                                                                            
+                                                                                    if (xitems) {
+                                                                                        this.load(xitems, n_iter);
+                                                                                        this.get('/LeftTree.view').el.expand_row(this.el.get_path(n_iter), true);
+                                                                                    }
+                                                                                    if (tp && (xitems || after)) {
+                                                                                        this.get('/LeftTree.view').el.expand_row(this.el.get_path(iter_par), true);
+                                                                                    }
+                                                                                    // wee need to get the empty proptypes from somewhere..
+                                                                                    
+                                                                                    //var olditer = this.activeIter;
+                                                                                    this.activePath = this.el.get_path(n_iter).to_string();
+                                                                            
+                                                                              // changed actually set's the node data..
+                                                                                    this.changed(node, true);
+                                                                                    
+                                                                                    
+                                                                                    
+                                                                                    this.get('/LeftTree.view').el.set_cursor(this.el.get_path(n_iter), null, false);
+                                                                                    
+                                                                                    //Builder.MidPropTree._model.load(node);
+                                                                                    //Builder.MidPropTree._win.hideWin();
+                                                                                    //Builder.LeftPanel._model.load( node);
+                                                                                    
+                                                                                        
+                                                                            },
+                                                                            findDropNode : function(treepath_str, targets) {
+                                                                            
+                                                                            // this is used by the dragdrop code in the roo version AFAIR..
+                                                                            
+                                                                                               var path = treepath_str.replace(/^builder-/, '');
+                                                                                        // treemap is depreciated... - should really check if model has any entries..
+                                                                            
+                                                                                        if (!this.el.iter_n_children(null)) {
+                                                                                            print("NO KEYS");
+                                                                                            return [ '',  Gtk.TreeViewDropPosition.INTO_OR_AFTER];
+                                                                                        }
+                                                                                        print("FIND treepath: " + path);
+                                                                                        //console.dump(this.treemap);
+                                                                                        
+                                                                                        if (!treepath_str.match(/^builder-/)) {
+                                                                                            return []; // nothing!
+                                                                                        }
+                                                                                        if (targets === true) {
+                                                                                            return [ path ];
+                                                                                        }
+                                                                                        return this.findDropNodeByPath(path,targets) 
+                                                                            },
+                                                                            findDropNodeByPath : function(treepath_str, targets, pref) {
+                                                                                var path = treepath_str + ''; // dupe it..
+                                                                                pref = typeof(pref) == 'undefined' ?  Gtk.TreeViewDropPosition.INTO_OR_AFTER : pref;
+                                                                                var last = false;
+                                                                                //console.dump(this.treemap);
+                                                                                while (path.length) {
+                                                                                    print("LOOKING FOR PATH: " + path);
+                                                                                    var node_data = this.singleNodeToJS(path);
+                                                                                    if (node_data === false) {
+                                                                                        print("node not found");
+                                                                                        return [];
+                                                                                    }
+                                                                                    
+                                                                                    var xname = this.get('/LeftTree.model').file.guessName(node_data);
+                                                                                    var match = false;
+                                                                                    var prop = '';
+                                                                                    targets.forEach(function(tg) {
+                                                                                        if (match) {
+                                                                                            return;;
+                                                                                        }
+                                                                                        if ((tg == xname)  ) {
+                                                                                            match = tg;
+                                                                                        }
+                                                                                        if (tg.indexOf(xname +':') === 0) {
+                                                                                            match = tg;
+                                                                                            prop = tg.split(':').pop();
+                                                                                        }
+                                                                                    });
+                                                                                    
+                                                                                    if (match) {
+                                                                                        if (last) { // pref is after/before..
+                                                                                            // then it's after last
+                                                                                            if (pref > 1) {
+                                                                                                return []; // do not allow..
+                                                                                            }
+                                                                                            return [ last, pref , prop];
+                                                                                            
+                                                                                        }
+                                                                                        return [ path , Gtk.TreeViewDropPosition.INTO_OR_AFTER , prop];
+                                                                                    }
+                                                                                    var par = path.split(':');
+                                                                                    last = path;
+                                                                                    par.pop();
+                                                                                    path = par.join(':');
+                                                                                }
+                                                                                
+                                                                                return [];
+                                                                                        
+                                                                            },
+                                                                            getIterValue : function (iter, col) {
+                                                                                var gval = new GObject.Value('');
+                                                                                this.el.get_value(iter, col ,gval);
+                                                                                return  gval.value;
+                                                                                
+                                                                                
+                                                                            },
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                             this.el.set_column_types ( 3, [
+                                                                                        GObject.TYPE_STRING, // title 
+                                                                                        GObject.TYPE_STRING, // tip
+                                                                                        GObject.TYPE_STRING // source..
+                                                                                        ] );
+                                                                            },
+                                                                            listAllTypes : function() {
+                                                                                var s = this.get('/LeftTree.view').selection;
+                                                                                print ("LIST ALL TYPES: " + s.count_selected_rows() );
+                                                                                
+                                                                                if (s.count_selected_rows() > 0) {
+                                                                                    var iter = new Gtk.TreeIter();    
+                                                                                    s.get_selected(this.el, iter);
+                                                                            
+                                                                                    // set some properties of the tree for use by the dropped element.
+                                                                                    var value = new GObject.Value('');
+                                                                                    this.el.get_value(iter, 2, value);
+                                                                                    var data = JSON.parse(value.value);
+                                                                                    
+                                                                                    
+                                                                                    var xname = this.get('/LeftTree.model').file.guessName(data);
+                                                                                    console.log('selected:' + xname);
+                                                                                    if (xname.length) {
+                                                                                        return [ xname ];
+                                                                                    }
+                                                                                    return []; // could not find it..
+                                                                                }
+                                                                                
+                                                                                var ret = [ ];
+                                                                                
+                                                                               var _this = this;
+                                                                                function addall(li)
+                                                                                {
+                                                                                    li.forEach(function(el) {
+                                                                                        // this is specific to roo!!!?
+                                                                                        if (!el) { // skip empty?
+                                                                                            return;
+                                                                                        }
+                                                                                        var fullpath =  _this.file.guessName(el);
+                                                                                        if (fullpath.length && ret.indexOf(fullpath) < 0) {
+                                                                                            ret.push(fullpath);
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        if (el.items && el.items.length) {
+                                                                                            addall(el.items);
+                                                                                        }
+                                                                                        
+                                                                                    });
+                                                                                    
+                                                                                    
+                                                                                }
+                                                                                
+                                                                                addall([this.currentTree]);
+                                                                                
+                                                                                // only if we have nothing, should we add '*top'
+                                                                                if (!ret.length) {
+                                                                                    ret = [ '*top' ];
+                                                                                }
+                                                                                //console.log('all types in tree');
+                                                                                //console.dump(ret);
+                                                                                
+                                                                                return ret;
+                                                                                                        
+                                                                            },
+                                                                            load : function(tr,iter)
+                                                                                    {
+                                                                                        var citer = new Gtk.TreeIter();
+                                                                                        //this.insert(citer,iter,0);
+                                                                                        for(var i =0 ; i < tr.length; i++) {
+                                                                                            if (iter) {
+                                                                                                this.el.insert(citer,iter,-1);
+                                                                                            } else {
+                                                                                                this.el.append(citer);
+                                                                                            }
+                                                                                            
+                                                                                            this.el.set_value(citer, 0, [GObject.TYPE_STRING, this.nodeTitle(tr[i]) ]);
+                                                                                            this.el.set_value(citer, 1, [GObject.TYPE_STRING, this.nodeTip(tr[i]) ]);
+                                                                                            this.el.set_value(citer, 2, [GObject.TYPE_STRING, this.nodeToJSON(tr[i])]);
+                                                                                            if (tr[i].items && tr[i].items.length) {
+                                                                                                this.load(tr[i].items, citer);
+                                                                                            }
+                                                                                        }     
+                                                                                    },
+                                                                            loadFile : function(f) {
+                                                                                //console.dump(f);
+                                                                                        this.el.clear();
+                                                                                        this.file = f;
+                                                                                        
+                                                                                        if (!f) {
+                                                                                            console.log('missing file');
+                                                                                            return;
+                                                                                        }
+                                                                                        
+                                                                                        // load the file if not loaded..
+                                                                                        if (f.items === false) {
+                                                                                            var _this = this;
+                                                                                            f.loadItems(function() {
+                                                                                                _this.loadFile(f);
+                                                                                            });
+                                                                                            return;
+                                                                                            
+                                                                                        }
+                                                                                        this.get('/Window').setTitle(f.project.getName() + ' - ' + f.name);
+                                                                                        
+                                                                                        if (f.items.length && typeof(f.items[0]) == 'string') {
+                                                                                        
+                                                                                            //this.get('/RightEditor').el.show();
+                                                                                            //this.get('/RightEditor.view').load( f.items[0]);
+                                                                                            return;
+                                                                                        }
+                                                                                        print("LOAD");
+                                                                                        print(JSON.stringify(f.items, null,4));
+                                                                                        //console.dump(f.items);
+                                                                                        this.load(f.items);
+                                                                                        this.get('/LeftTree.view').el.expand_all();
+                                                                            
+                                                                                        if (!f.items.length) {
+                                                                                            // single item..
+                                                                                            
+                                                                                            this.get('/Window.leftvpaned').el.set_position(80);
+                                                                                            // select first...
+                                                                                            this.get('/LeftTree.view').el.set_cursor( 
+                                                                                                new  Gtk.TreePath.from_string('0'), null, false);
+                                                                                            
+                                                                                            
+                                                                                        } else {
+                                                                                              this.get('/Window.leftvpaned').el.set_position(200);
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        //print("hide right editior");
+                                                                                        //this.get('/RightEditor').el.hide();
+                                                                                        this.get('/Editor').el.hide();
+                                                                                        //print("set current tree");
+                                                                                        this.currentTree = this.toJS(false, false)[0];
+                                                                                        //console.dump(this.currentTree);
+                                                                                        this.currentTree = this.currentTree || { items: [] };
+                                                                                        this.get('/LeftTree').renderView();
+                                                                                        //console.dump(this.map);
+                                                                                        //var RightPalete     = imports.Builder.RightPalete.RightPalete;
+                                                                                        var pm = this.get('/RightPalete.model');
+                                                                                        // set up provider..
+                                                                                        
+                                                                                        this.get('/RightPalete').provider = this.get('/LeftTree').getPaleteProvider();
+                                                                                        
+                                                                                        if (!this.get('/RightPalete').provider) {
+                                                                                            print ("********* PALETE PROVIDER MISSING?!!");
+                                                                                        }
+                                                                                        this.get('/LeftTree').renderView();
+                                                                                        
+                                                                                        pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(this.listAllTypes()));
+                                                                                        
+                                                                                        
+                                                                                                
+                                                                                        this.get('/Window.view-notebook').el.set_current_page(
+                                                                                            this.get('/LeftTree.model').file.getType()== 'Roo' ? 0 : -1);
+                                                                                                
+                                                                            },
+                                                                            moveNode : function(target_data, action) {
+                                                                                 //print("MOVE NODE");
+                                                                                       // console.dump(target_data);
+                                                                                        var old_iter = new Gtk.TreeIter();
+                                                                                        var s = this.get('/LeftTree.view').selection;
+                                                                                        s.get_selected(this.el, old_iter);
+                                                                                        var node = this.nodeToJS(old_iter,false);
+                                                                                        //console.dump(node);
+                                                                                        
+                                                                                        
+                                                                                        // needs to drop first, otherwise the target_data 
+                                                                                        // treepath will be invalid.
+                                                                                        
+                                                                                        this.dropNode(target_data, node);
+                                                                                 if (action & Gdk.DragAction.MOVE) {
+                                                                                                  //          print("REMOVING OLD NODE");
+                                                                                                            this.el.remove(old_iter);
+                                                                                                            
+                                                                                        }
+                                                                                        
+                                                                                        this.activePath= false;
+                                                                                        this.changed(false,true);
+                                                                            },
+                                                                            nodeTip : function(c) {
+                                                                                var ret = this.nodeTitle(c,true);
+                                                                                var funcs = '';
+                                                                            
+                                                                                
+                                                                                for( var i in c) {
+                                                                            
+                                                                                    if (!i.length || i[0] != '|') {
+                                                                                        continue;
+                                                                                    }
+                                                                                    if (i == '|init') { 
+                                                                                        continue;
+                                                                                    }
+                                                                                    if (typeof(c[i]) != 'string') {
+                                                                                       continue;
+                                                                                    }
+                                                                                    //print("prop : " + i + ':' + c[i]);
+                                                                                    if (!c[i].match(new RegExp('function'))) {
+                                                                                        continue;
+                                                                                    }
+                                                                                    funcs += "\n<b>" + i.substring(1) + '</b> : ' + c[i].split(/\n/).shift();
+                                                                                        
+                                                                                }
+                                                                                if (funcs.length) {
+                                                                                    ret+="\n\nMethods:" + funcs;
+                                                                                }
+                                                                                return ret;
+                                                                                
+                                                                            },
+                                                                            nodeTitle : function(c, renderfull) {
+                                                                                  var txt = [];
+                                                                                c = c || {};
+                                                                                var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;
+                                                                                if (sr) txt.push('<s>');
+                                                                                if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }
+                                                                                
+                                                                                if (renderfull && c['|xns']) {
+                                                                                    txt.push(c['|xns']);
+                                                                                }
+                                                                                
+                                                                                if (c.xtype)      { txt.push(c.xtype); }
+                                                                                if (c.id)      { txt.push('<b>[id=' + c.id + ']</b>'); }
+                                                                                if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }
+                                                                                if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }
+                                                                                
+                                                                                
+                                                                                if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }
+                                                                                if (c.title)      { txt.push('<b>' + c.title + '</b>'); }
+                                                                                if (c.label)      { txt.push('<b>' + c.label+ '</b>'); }
+                                                                                if (c.header)    { txt.push('<b>' + c.header + '</b>'); }
+                                                                                if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }
+                                                                                if (c.text)       { txt.push('<b>' + c.text + '</b>'); }
+                                                                                if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }
+                                                                                if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }
+                                                                                if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }
+                                                                                
+                                                                                // for flat classes...
+                                                                                if (typeof(c['*class']) != 'undefined')  { txt.push('<b>' +  c['*class']+  '</b>'); }
+                                                                                if (typeof(c['*extends']) != 'undefined')  { txt.push(': <i>' +  c['*extends']+  '</i>'); }
+                                                                                
+                                                                                
+                                                                                if (sr) txt.push('</s>');
+                                                                                return (txt.length == 0 ? "Element" : txt.join(" "));
+                                                                            },
+                                                                            nodeToJS : function (treepath, with_id) 
+                                                                            {
+                                                                                
+                                                                                var iter = treepath;  // API used to be iter here..
+                                                                                if (typeof(iter) == 'string') {
+                                                                                    iter = new Gtk.TreeIter(); 
+                                                                                    if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {
+                                                                                        return false;
+                                                                                    }
+                                                                                } 
+                                                                                var par = new Gtk.TreeIter(); 
+                                                                                var iv = this.getIterValue(iter, 2);
+                                                                               // print("IV" + iv);
+                                                                                var k = JSON.parse(iv);
+                                                                                if (k.json && !this.el.iter_parent( par, iter  )) {
+                                                                                    delete k.json;
+                                                                                }
+                                                                                
+                                                                                if (with_id) {
+                                                                                    var treepath_str = this.el.get_path(iter).to_string();
+                                                                                    // not sure how we can handle mixed id stuff..
+                                                                                    if (typeof(k.id) == 'undefined')  {
+                                                                                        k.id =  'builder-'+ treepath_str ;
+                                                                                    }
+                                                                                    
+                                                                                    // needed??
+                                                                                    this.treemap[  treepath_str ] = k;
+                                                                                    k.xtreepath = treepath_str ;
+                                                                                    
+                                                                                }
+                                                                                if (this.el.iter_has_child(iter)) {
+                                                                                    citer = new Gtk.TreeIter();
+                                                                                    this.el.iter_children(citer, iter);
+                                                                                    k.items = this.toJS(citer,with_id);
+                                                                                }
+                                                                                return k;
+                                                                            },
+                                                                            nodeToJSON : function(c) {
+                                                                                var o  = {}
+                                                                                for (var i in c) {
+                                                                                    if (i == 'items') {
+                                                                                         continue;
+                                                                                    }
+                                                                                    o[i] = c[i];
+                                                                                }
+                                                                                return JSON.stringify(o);
+                                                                            },
+                                                                            singleNodeToJS : function (treepath) 
+                                                                                    {
+                                                                                        var iter = new Gtk.TreeIter(); 
+                                                                                        if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {
+                                                                                            return false;
+                                                                                        }
+                                                                                        
+                                                                                        var iv = this.getIterValue(iter, 2);
+                                                                                       
+                                                                                        return JSON.parse(iv);
+                                                                                        
+                                                                                    },
+                                                                            toJS : function(treepath, with_id)
+                                                                            {
+                                                                                //Seed.print("WITHID: "+ with_id);
+                                                                                var iter = treepath;  // API used to be iter here..
+                                                                                if (typeof(iter) == 'string') {
+                                                                                    iter = new Gtk.TreeIter(); 
+                                                                                    if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {
+                                                                                        return false;
+                                                                                    }
+                                                                                } 
+                                                                                var first = false;
+                                                                                if (!iter) {
+                                                                                    
+                                                                                    this.treemap = { }; 
+                                                                                    
+                                                                                    iter = new Gtk.TreeIter();
+                                                                                    if (!this.el.get_iter_first(iter)) {
+                                                                                        return [];
+                                                                                    }
+                                                                                    first = true;
+                                                                                } 
+                                                                                
+                                                                                var ar = [];
+                                                                                   
+                                                                                while (true) {
+                                                                                    
+                                                                                    var k = this.nodeToJS(iter, with_id); 
+                                                                                    ar.push(k);
+                                                                                    
+                                                                                    
+                                                                                    if (!this.el.iter_next(iter)) {
+                                                                                        break;
+                                                                                    }
+                                                                                }
+                                                                                
+                                                                                if (treepath === false) {
+                                                                                    //dupe!!!
+                                                                                    return JSON.parse(JSON.stringify(ar));
+                                                                                }
+                                                                                
+                                                                                return ar;
+                                                                                // convert the list into a json string..
+                                                                            
+                                                                                
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.TreeViewColumn,
+                                                                            pack : "append_column",
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                               this.el.add_attribute(this.items[0].el , 'markup', 0 );
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.CellRendererText,
+                                                                                    pack : "pack_start"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.Menu,
+                                                                    pack : false,
+                                                                    id : "LeftTreeMenu",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "add",
+                                                                            label : "Delete Element",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                     this.get('/LeftTree.model').deleteSelected();
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                     var tree = this.get('/LeftTree');
+                                                                                      var model = this.get('/LeftTree.model');
+                                                                                     var el = tree.getActivePath();
+                                                                                     print(el);
+                                                                                     var js = model.toJS(el, false);
+                                                                                    // print(JSON.stringify(js[0], null,4));
+                                                                                     this.get('/DialogSaveTemplate').show(JSON.stringify(js[0], null,4));
+                                                                                     
+                                                                                    
+                                                                                }
+                                                                            },
+                                                                            label : "Save as Template",
+                                                                            pack : "add"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.VBox,
+                                                            pack : "add",
+                                                            id : "LeftProjectTree",
+                                                            showNoProjectSelected : function() {
+                                                               this.get('/StandardErrorDialog').show("Select a Project first."); 
+                                                            },
+                                                            getActiveProject : function() {
+                                                                 return this.project;
+                                                            },
+                                                            listeners : {
+                                                                leave_notify_event : function (self, event) {
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "pack_start,false,false",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.ComboBox,
+                                                                            id : "combo",
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                                this.el.add_attribute(this.get('render').el , 'markup', 1 );  
+                                                                            },
+                                                                            getValue : function() {
+                                                                                var ix = this.el.get_active();
+                                                                                if (ix < 0 ) {
+                                                                                    return false;
+                                                                                }
+                                                                                var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;
+                                                                                if (typeof(data[ix]) == 'undefined') {
+                                                                               return false; 
+                                                                                }
+                                                                                return data[ix].fn;
+                                                                            },
+                                                                            setValue : function(fn)
+                                                                            {
+                                                                                var el = this.el;
+                                                                                el.set_active(-1);
+                                                                                var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;
+                                                                                data.forEach(function(n, ix) {
+                                                                                    if (fn == n.fn) {
+                                                                                        el.set_active(ix);
+                                                                                        return false;
+                                                                                    }
+                                                                                });
+                                                                            },
+                                                                            listeners : {
+                                                                                changed : function (self) {
+                                                                                       var fn = this.getValue();
+                                                                                       var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                                                       this.get('/LeftProjectTree.model').loadProject(pm.getByFn(fn))
+                                                                                }
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.CellRendererText,
+                                                                                    pack : "pack_start,true",
+                                                                                    id : "render"
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.ListStore,
+                                                                                    pack : "set_model",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                      this.el.set_column_types ( 2, [
+                                                                                            GObject.TYPE_STRING,  // real key
+                                                                                            GObject.TYPE_STRING // real type
+                                                                                            
+                                                                                            
+                                                                                        ] );
+                                                                                       var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                                                       var _this = this;
+                                                                                       pm.on('changed', function() {
+                                                                                           print("caught changed hook on project manager - reloading data");
+                                                                                       _this.loadData(pm.projects);
+                                                                                    
+                                                                                       });
+                                                                                    },
+                                                                                    loadData : function(data) {
+                                                                                         var ov = this.get('/LeftProjectTree.combo').getValue();
+                                                                                        this.el.clear();
+                                                                                        var iter = new Gtk.TreeIter();
+                                                                                        var el = this.el;
+                                                                                        data.forEach(function(p) {
+                                                                                            
+                                                                                            el.append(iter);
+                                                                                            
+                                                                                             
+                                                                                            el.set_value(iter, 0, p.fn);
+                                                                                            el.set_value(iter, 1, p.name);
+                                                                                            
+                                                                                        });
+                                                                                        
+                                                                                        this.get('/LeftProjectTree.combo').setValue(ov);
+                                                                                    },
+                                                                                    id : "combomodel"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.ScrolledWindow,
+                                                                    pack : "add",
+                                                                    shadow_type : Gtk.ShadowType.IN,
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                        this.el.set_policy  (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC );
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.TreeView,
+                                                                            listeners : {
+                                                                                cursor_changed : function (self) {
+                                                                                       var iter = new Gtk.TreeIter();
+                                                                                                                
+                                                                                        if (this.selection.count_selected_rows() < 1) {
+                                                                                            //XN.get('Builder.LeftTree.model').
+                                                                                            this.get('/LeftTree.model').load( false);
+                                                                                            
+                                                                                            return;
+                                                                                        }
+                                                                                        var model = this.get('/LeftProjectTree.model');
+                                                                                        //console.log('changed');
+                                                                                        var s = this.selection;
+                                                                                        s.get_selected(model, iter);
+                                                                                        value = new GObject.Value('');
+                                                                                        model.el.get_value(iter, 2, value);
+                                                                                        
+                                                                                        console.log(value.value);// id..
+                                                                                        
+                                                                                        var file = this.get('/LeftProjectTree').project.getById(value.value);
+                                                                                        
+                                                                                        file.items = false;
+                                                                                        console.log(file);
+                                                                                        
+                                                                                
+                                                                                
+                                                                                        var nb = this.get('/LeftTopPanel.expander');
+                                                                                        nb.el.expanded = false;
+                                                                                        nb.onCollapse();
+                                                                                        //nb.listeners.activate.call(nb);
+                                                                                        //_expander.el.set_expanded(false);
+                                                                                
+                                                                                        var ltm = this.get('/LeftTree.model');
+                                                                                        ltm.loadFile(file);
+                                                                                        
+                                                                                        return true;
+                                                                                }
+                                                                            },
+                                                                            id : "view",
+                                                                            tooltip_column : 1,
+                                                                            enable_tree_lines : true,
+                                                                            headers_visible : false,
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                            var description = new Pango.FontDescription.c_new();
+                                                                                                        description.set_size(8000);
+                                                                                                        this.el.modify_font(description);
+                                                                                                        
+                                                                                                        this.selection = this.el.get_selection();
+                                                                                                        this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.TreeStore,
+                                                                                    pack : "set_model",
+                                                                                    id : "model",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                      this.el.set_column_types ( 3, [
+                                                                                                        GObject.TYPE_STRING, // title 
+                                                                                                        GObject.TYPE_STRING, // tip
+                                                                                                        GObject.TYPE_STRING // id..
+                                                                                                        ] );
+                                                                                       
+                                                                                    },
+                                                                                    loadProject : function(pr) {
+                                                                                    print("LOAD PROJECT");
+                                                                                               this.el.clear();
+                                                                                                if (!pr) {
+                                                                                                    return;
+                                                                                                }
+                                                                                                
+                                                                                                this.get('/LeftProjectTree').project = pr;
+                                                                                                this.load(pr.toTree());
+                                                                                                this.get('/LeftProjectTree.view').el.expand_all();
+                                                                                    },
+                                                                                    load : function(tr,iter) {
+                                                                                      //  console.dump(tr);
+                                                                                                console.log('Project tree load: ' + tr.length);
+                                                                                                var citer = new Gtk.TreeIter();
+                                                                                                //this.insert(citer,iter,0);
+                                                                                                
+                                                                                                var _this = this;
+                                                                                                tr.forEach(function (r) {
+                                                                                                    if (!iter) {
+                                                                                                        _this.el.append(citer);   
+                                                                                                    } else {
+                                                                                                        _this.el.insert(citer,iter,-1);
+                                                                                                    }
+                                                                                                    _this.el.set_value(citer, 0,  '' + r.getTitle() ); // title 
+                                                                                                    _this.el.set_value(citer, 1, '' + r.getTitleTip()); // tip
+                                                                                                    _this.el.set_value(citer, 2, '' + r.id ); //id
+                                                                                                    if (r.cn && r.cn.length) {
+                                                                                                        _this.load(r.cn, citer);
+                                                                                                    }
+                                                                                                    
+                                                                                                });
+                                                                                    },
+                                                                                    getValue : function(iter, col) {
+                                                                                        var gval = new GObject.Value('');
+                                                                                        this.el.get_value(iter, col ,gval);
+                                                                                        return  '' + gval.value;
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.TreeViewColumn,
+                                                                                    pack : "append_column",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                        this.el.add_attribute(this.items[0].el , 'markup', 0 );
+                                                                                    },
+                                                                                    items : [
+                                                                                        {
+                                                                                            xtype: Gtk.CellRendererText,
+                                                                                            pack : "pack_start"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            xtype: Gtk.VBox,
+                                            items : [
+                                                {
+                                                    xtype: Gtk.HBox,
+                                                    pack : "pack_start,false,true,0",
+                                                    id : "LeftProps",
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            pack : "add",
+                                                            listeners : {
+                                                                button_press_event : function (self, event) {
+                                                                    this.get('/MidPropTree.model').showData('props');
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.Image,
+                                                                            pack : "add",
+                                                                            stock : Gtk.STOCK_ADD,
+                                                                            icon_size : Gtk.IconSize.MENU
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.Label,
+                                                                            pack : "add",
+                                                                            label : "Property"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            pack : "add",
+                                                            listeners : {
+                                                                button_press_event : function (self, event) {
+                                                                    this.get('/MidPropTree.model').showData('events');
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.Image,
+                                                                            pack : "add",
+                                                                            stock : Gtk.STOCK_ADD,
+                                                                            icon_size : Gtk.IconSize.MENU
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.Label,
+                                                                            pack : "add",
+                                                                            label : "Handler"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            pack : "add",
+                                                            listeners : {
+                                                                button_press_event : function (self, ev) {
+                                                                       var p = this.get('/AddPropertyPopup');
+                                                                       if (!p.el) {
+                                                                               p.init();
+                                                                       }
+                                                                       p.el.set_screen(Gdk.Screen.get_default());
+                                                                        p.el.show_all();
+                                                                         p.el.popup(null, null, null, null, 3, ev.button.time);
+                                                                    return true;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.Image,
+                                                                            pack : "add",
+                                                                            stock : Gtk.STOCK_ADD,
+                                                                            icon_size : Gtk.IconSize.MENU
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.Label,
+                                                                            pack : "add",
+                                                                            label : "Other"
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.Menu,
+                                                                    pack : false,
+                                                                    id : "AddPropertyPopup",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Using this.get('*someid') will find any id in an application.",
+                                                                            label : "ID",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                        key : 'id', 
+                                                                                        type : 'string',
+                                                                                        val : '',
+                                                                                        //skel  : skel,
+                                                                                        etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add what type of packing is to be used",
+                                                                            label : "PACK",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                        key : 'pack', 
+                                                                                                type : 'string',
+                                                                                                val : 'add',
+                                                                                          etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Override the init method",
+                                                                            label : "INIT",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                       key : '|init', 
+                                                                                        type : 'function',
+                                                                                        val  : "function() {\n    XObject.prototype.init.call(this);\n}\n",
+                                                                                        etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.SeparatorMenuItem,
+                                                                            pack : "add"
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user defined string property",
+                                                                            label : "String",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                                 key : '', 
+                                                                                                type : 'string',
+                                                                                                val  : "",
+                                                                                                etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user defined number property",
+                                                                            label : "Number",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                                 key : '', 
+                                                                                                type : 'number',
+                                                                                                val  : 0,
+                                                                                                etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user defined boolean property",
+                                                                            label : "Boolean",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                                 key : '', 
+                                                                                                type : 'boolean',
+                                                                                                val  : false,
+                                                                                                etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.SeparatorMenuItem,
+                                                                            pack : "add"
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user function boolean property",
+                                                                            label : "Function",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                           key : '|', 
+                                                                                                        type : 'function',
+                                                                                                        val  : "function() {\n    \n}\n",
+                                                                                                        etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    editing : false,
+                                                    id : "LeftPanel",
+                                                    pack : "add",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                    },
+                                                    shadow_type : Gtk.ShadowType.IN,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.TreeView,
+                                                            listeners : {
+                                                                button_press_event : function (self, ev) {
+                                                                
+                                                                    
+                                                                    var res = { }; 
+                                                                    
+                                                                    if (!this.el.get_path_at_pos(ev.button.x,ev.button.y, res)) {
+                                                                        return false; //not on a element.
+                                                                    }
+                                                                    
+                                                                     // right click.
+                                                                     if (ev.type == Gdk.EventType.BUTTON_PRESS  && ev.button.button == 3) {    
+                                                                        // show popup!.   
+                                                                        if (res.column.title == 'value' && this.get('/LeftPanel').editing) {
+                                                                            return false;
+                                                                        }
+                                                                        //if (! this.get('/LeftPanelPopup')LeftPanelPopup.el) LeftPanelPopup.init();
+                                                                        var p = this.get('/LeftPanelPopup');
+                                                                        if (!p.el) {
+                                                                            p.init();
+                                                                        }
+                                                                
+                                                                        p.el.set_screen(Gdk.Screen.get_default());
+                                                                        p.el.show_all();
+                                                                        p.el.popup(null, null, null, null, 3, ev.button.time);
+                                                                        //Seed.print("click:" + res.column.title);
+                                                                        
+                                                                        
+                                                                        return false;
+                                                                    }
+                                                                    
+                                                                     
+                                                                    if (res.column.title != 'value') {
+                                                                          //  XObject.error("column is not value?");
+                                                                        return false; // ignore.. - key click.. ??? should we do this??
+                                                                    }
+                                                                    
+                                                                    // currently editing???
+                                                                //    if (  this.activePath) {
+                                                                        
+                                                                     //   this.activePath = false;
+                                                                       // stop editing!!!!
+                                                                        if (this.get('/Editor').dirty) {
+                                                                            //if (!this.get('/Editor.buffer').checkSyntax()) {
+                                                                            //   this.get('/StandardErrorDialog').show("Fix errors in code and save.."); 
+                                                                            //   return true;
+                                                                            //    // error Dialog
+                                                                            //}
+                                                                            if (!this.get('/Editor.view').save()) {
+                                                                                return true;
+                                                                            }
+                                                                        }   
+                                                                        this.get('/LeftPanel').editableColumn.items[0].el.stop_editing();
+                                                                        this.get('/LeftPanel').editing = false;
+                                                                    
+                                                                    //    XObject.error("Currently editing?");
+                                                                     //   return false;
+                                                                   // }
+                                                                    
+                                                                    var renderer = this.get('/LeftPanel').editableColumn.items[0].el; // set has_entry..
+                                                                    
+                                                                    var type = this.get('/LeftPanel.model').getType(res.path.to_string());
+                                                                        
+                                                                    // get options for this type -- this is to support option lists etc..
+                                                                    var provider = this.get('/LeftTree').getPaleteProvider();
+                                                                    var opts = provider.findOptions(type);
+                                                                    
+                                                                    if (opts === false) {
+                                                                        // it's text etnry
+                                                                         this.get('/LeftPanel').editableColumn.setOptions([]);
+                                                                        renderer.has_entry = true;
+                                                                    } else {
+                                                                         this.get('/LeftPanel').editableColumn.setOptions(opts);
+                                                                        renderer.has_entry = false;
+                                                                    }
+                                                                    this.get('/LeftPanel.model').startEditing(res.path.to_string(), 1);
+                                                                        
+                                                                   //Seed.print("click" + ev.type);
+                                                                    //console.dump(res);
+                                                                    return false;
+                                                                
+                                                                              
+                                                                   
+                                                                }
+                                                            },
+                                                            id : "view",
+                                                            tooltip_column : 5,
+                                                            enable_tree_lines : true,
+                                                            headers_visible : false,
+                                                            init : function() {
+                                                                 XObject.prototype.init.call(this); 
+                                                                                   
+                                                                                this.selection = this.el.get_selection();
+                                                                                this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                                             
+                                                                                
+                                                                                var description = new Pango.FontDescription.c_new();
+                                                                                description.set_size(8000);
+                                                                                this.el.modify_font(description);
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.TreeStore,
+                                                                    activePath : false,
+                                                                    id : "model",
+                                                                    pack : "set_model",
+                                                                    add : function(info) {
+                                                                          // info includes key, val, skel, etype..
+                                                                                  console.dump(info);
+                                                                                type = info.type.toLowerCase();
+                                                                                var data = this.toJS();
+                                                                                
+                                                                                if (info.etype == 'events') {
+                                                                                    data.listeners = data.listeners || { };
+                                                                                    if (typeof(data.listeners[info.key]) != 'undefined') {
+                                                                                        return; //already set!
+                                                                                    }
+                                                                                } else {
+                                                                                    if (typeof(data[info.key]) != 'undefined') {
+                                                                                        return;
+                                                                                    }
+                                                                                }
+                                                                                
+                                                                                if (typeof(info.val) == 'undefined') {
+                                                                                        
+                                                                                    info.val = '';
+                                                                                    if (info.type.toLowerCase() == 'boolean') {
+                                                                                        info.val = true;
+                                                                                    }
+                                                                                    if (type == 'number') {
+                                                                                        info.val = 0;
+                                                                                    }
+                                                                                    // utf8 == string..
+                                                                                    
+                                                                                    
+                                                                                }
+                                                                                var k = info.key;
+                                                                                if (info.etype == 'events') {
+                                                                                 
+                                                                                    data.listeners[info.key] = info.val;
+                                                                                    k = '!' + info.key;
+                                                                                } else {
+                                                                                    data[info.key] = info.val;
+                                                                                }
+                                                                                
+                                                                                
+                                                                                var map = this.load(data);
+                                                                                
+                                                                                // flag it as changed to the interface..
+                                                                    
+                                                                                this.get('/LeftTree.model').changed(data, true); 
+                                                                                
+                                                                                
+                                                                                this.startEditing(map[k]);
+                                                                                 
+                                                                                /*
+                                                                                LeftPanel.get('view').el.row_activated(
+                                                                                    new Gtk.TreePath.from_string(map[k]), 
+                                                                                    LeftPanel.editableColumn.el
+                                                                                );
+                                                                                */
+                                                                    },
+                                                                    changed : function(str, doRefresh) {
+                                                                        if (!this.activePath) {
+                                                                            return;
+                                                                        }
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath));
+                                                                        
+                                                                        this.el.set_value(iter, 1, '' +str);
+                                                                        this.el.set_value(iter, 3, '' + this.toShort(str));
+                                                                        var type = this.getIterValue(iter, 4);
+                                                                    
+                                                                        this.el.set_value(iter, 5, type + ' : ' + str);
+                                                                        // update the tree...  
+                                                                    
+                                                                        this.get('/LeftTree.model').changed(this.toJS(), doRefresh); 
+                                                                    },
+                                                                    deleteSelected : function() {
+                                                                         var data = this.toJS();
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        var s = this.get('/LeftPanel.view').selection;
+                                                                        s.get_selected(this.el, iter);
+                                                                             
+                                                                           
+                                                                        var gval = new GObject.Value('');
+                                                                       this.get('/LeftPanel.model').el.get_value(iter, 0 ,gval);
+                                                                        
+                                                                        var val = gval.value;
+                                                                        if (val[0] == '!') {
+                                                                            // listener..
+                                                                            if (!data.listeners || typeof(data.listeners[  val.substring(1)]) == 'undefined') {
+                                                                                return;
+                                                                            }
+                                                                            delete data.listeners[  val.substring(1)];
+                                                                            if (!XObject.keys(data.listeners).length) {
+                                                                                delete data.listeners;
+                                                                            }
+                                                                            
+                                                                        } else {
+                                                                            if (typeof(data[val]) == 'undefined') {
+                                                                                return;
+                                                                            }
+                                                                            delete data[val];
+                                                                        }
+                                                                        
+                                                                        
+                                                                        this.load(data);
+                                                                        this.get('/LeftTree.model').changed(data, true);
+                                                                        
+                                                                    },
+                                                                    getIterValue : function(iter, col) {
+                                                                         var gval = new GObject.Value('');
+                                                                        this.get('/LeftPanel.model').el.get_value(iter, col ,gval);
+                                                                        return '' + gval.value;
+                                                                    },
+                                                                    getType : function(treepath) {
+                                                                         return this.getValue(treepath, 4);
+                                                                    },
+                                                                    getValue : function(treepath_str, col) 
+                                                                    {
+                                                                       // get's the  value in a row.. - keys - returns string, values - formats it..
+                                                                    
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath_str));
+                                                                        
+                                                                        var gval = new GObject.Value('');
+                                                                        this.get('/LeftPanel.model').el.get_value(iter, col ,gval);
+                                                                        var val = '' + gval.value;
+                                                                       
+                                                                        if (col != 1) {
+                                                                            return val;
+                                                                        }
+                                                                        var type = this.getType(this.el.get_path(iter).to_string());
+                                                                        //print("TYPE: " +type + " -  val:" + val);
+                                                                        switch(type.toLowerCase()) {
+                                                                            case 'number':
+                                                                            case 'uint':
+                                                                            case 'int':
+                                                                                return parseFloat(val); // Nan ?? invalid!!?        
+                                                                            case 'float':
+                                                                            case 'gfloat':
+                                                                                return 1.0 * parseFloat(val); // Nan ?? invalid!!?
+                                                                            case 'boolean':
+                                                                                return val == 'true' ? true : false;
+                                                                            default: 
+                                                                                var nv = parseFloat(val);
+                                                                                if (!isNaN(nv) && (val == ''+nv)) {
+                                                                                    return nv;
+                                                                                }
+                                                                                return val;
+                                                                        }
+                                                                                                
+                                                                    },
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                    this.el.set_column_types ( 6, [
+                                                                                                    GObject.TYPE_STRING,  // 0 real key
+                                                                                                    GObject.TYPE_STRING, // 1 real value 
+                                                                                                     GObject.TYPE_STRING,  // 2 visable key
+                                                                                                     GObject.TYPE_STRING, // 3 visable value
+                                                                                                     GObject.TYPE_STRING, // 4 need to store type of!!!
+                                                                                                      GObject.TYPE_STRING // 5 tooltip
+                                                                                                  
+                                                                                                ]);
+                                                                    },
+                                                                    load : function(ar) {
+                                                                      this.el.clear();
+                                                                                            
+                                                                        //this.get('/RightEditor').el.hide();
+                                                                        if (ar === false) {
+                                                                            return ;
+                                                                        }
+                                                                        var ret = {}; 
+                                                                        
+                                                                    
+                                                                        var provider = this.get('/LeftTree').getPaleteProvider();
+                                                                         var iter = new Gtk.TreeIter();
+                                                                         
+                                                                        // sort!!!?
+                                                                        var keys  = XObject.keys(ar);
+                                                                        keys.sort();
+                                                                        ar.listeners = ar.listeners || {};
+                                                                        
+                                                                        for (var i in ar.listeners ) {
+                                                                            this.el.append(iter);
+                                                                            var p = this.el.get_path(iter).to_string();
+                                                                            ret['!' + i] = p;
+                                                                            
+                                                                            this.el.set_value(iter, 0, '!'+  i  );
+                                                                            this.el.set_value(iter, 1, '' + ar.listeners[i]);
+                                                                            this.el.set_value(iter, 2, '<b>'+ i + '</b>');
+                                                                            
+                                                                            this.el.set_value(iter, 3, '' + this.toShort(ar.listeners[i]));
+                                                                            this.el.set_value(iter, 4, 'function');
+                                                                            this.el.set_value(iter, 5, i + ' : ' + ar.listeners[i]);
+                                                                        }
+                                                                        
+                                                                        
+                                                                       
+                                                                        var _this = this;
+                                                                        keys.forEach(function(i) {
+                                                                            if (typeof(ar[i]) == 'object') {
+                                                                                return;
+                                                                            }
+                                                                            
+                                                                            var type = provider.findType(ar, i, ar[i]);
+                                                                            
+                                                                            _this.el.append(iter);
+                                                                            var p = _this.el.get_path(iter).to_string();
+                                                                            ret[i] = p;
+                                                                            _this.el.set_value(iter, 0, ''+i);
+                                                                            _this.el.set_value(iter, 1, '' + ar[i]);  
+                                                                            _this.el.set_value(iter, 2, ''+i);
+                                                                            _this.el.set_value(iter, 3, ''+ _this.toShort(ar[i]));
+                                                                            _this.el.set_value(iter, 4, ''+type);
+                                                                            _this.el.set_value(iter, 5, type + ' : ' + ar[i]);
+                                                                        })
+                                                                        return ret;
+                                                                    },
+                                                                    startEditing : function(path,col) {
+                                                                        
+                                                                        // alled by menu 'edit' currently..
+                                                                        /**
+                                                                        * start editing path (or selected if not set..)
+                                                                        * @param {String|false} path  (optional) treepath to edit - selected tree gets
+                                                                        *     edited by default.
+                                                                        * @param {Number} 0 or 1 (optional)- column to edit. 
+                                                                        */
+                                                                        // fix tp to be the 'treepath' string (eg. 0/1/2...)
+                                                                        var tp;
+                                                                        if (typeof(path) == 'string') {
+                                                                            tp = new Gtk.TreePath.from_string(path);
+                                                                        } else {
+                                                                            var iter = new Gtk.TreeIter();
+                                                                            var s = this.get('/LeftPanel.view').selection;
+                                                                            s.get_selected(this.el, iter);
+                                                                            tp = this.el.get_path(iter);
+                                                                            path = tp.to_string();
+                                                                        }
+                                                                        
+                                                                       
+                                                                        // which colum is to be edited..
+                                                                        var colObj = false;
+                                                                        
+                                                                        // not sure what this does..
+                                                                        
+                                                                        if (typeof(col) == 'undefined') {
+                                                                            var k = this.getValue(path, 0);
+                                                                            col = 1;
+                                                                            colObj = (!k.length || k == '|') ? 
+                                                                                this.get('/LeftPanel').propertyColumn : this.get('/LeftPanel').editableColumn;
+                                                                        } else {
+                                                                            colObj = col ? this.get('/LeftPanel').editableColumn : this.get('/LeftPanel').propertyColumn;
+                                                                        }
+                                                                        
+                                                                        // make sure the pulldown is set correctly..
+                                                                        // not really needed for second col...
+                                                                        var showEditor = false;
+                                                                        
+                                                                        if (col) {
+                                                                            var provider = this.get('/LeftTree').getPaleteProvider();
+                                                                            var type = this.get('/LeftPanel.model').getType(path);
+                                                                            var opts = provider.findOptions(type);
+                                                                            var renderer = this.get('/LeftPanel').editableColumn.items[0].el;
+                                                                            
+                                                                            if (opts === false) {
+                                                                                this.get('/LeftPanel').editableColumn.setOptions([]);
+                                                                                renderer.has_entry = true; 
+                                                                            } else {
+                                                                                this.get('/LeftPanel').editableColumn.setOptions(opts);
+                                                                                renderer.has_entry = false;/// - pulldowns do not have entries
+                                                                            }
+                                                                            // determine if we should use the Text editor...
+                                                                            var keyname = this.getValue(path, 0);
+                                                                            var data_value = this.getValue(path, 1);
+                                                                        
+                                                                            if ((keyname[0] == '|') || 
+                                                                                (   
+                                                                                    (typeof(data_value) == 'string' ) && 
+                                                                                    ( data_value.match(/function/g) || data_value.match(/\n/g)) // || (data_value.length > 20))
+                                                                                )) {
+                                                                                showEditor = true;
+                                                                            }
+                                                                            print("SHOW EDITOR" + showEditor ? 'YES' :'no');
+                                                                            
+                                                                        }
+                                                                        var _this = this;    
+                                                                        // end editing..
+                                                                        this.get('/BottomPane').el.hide();
+                                                                        //this.get('/RightEditor').el.hide();
+                                                                         this.get('/Editor').el.hide();
+                                                                        
+                                                                        if (showEditor) {
+                                                                    
+                                                                            this.activePath = false;
+                                                                            _this.get('/Editor').el.show_all();
+                                                                            GLib.timeout_add(0, 1, function() {
+                                                                    
+                                                                                //_this.get('/BottomPane').el.show();
+                                                                                 //_this.get('/RightEditor').el.show();
+                                                                                
+                                                                                _this.get('/Editor.RightEditor.view').load( _this.getValue(path, 1) );
+                                                                                
+                                                                                //e.editing_done();
+                                                                                //e.remove_widget();
+                                                                                _this.activePath = path ;
+                                                                              
+                                                                                return false;
+                                                                            });
+                                                                            return;
+                                                                        }
+                                                                          
+                                                                        
+                                                                        
+                                                                    
+                                                                        // iter now has row...
+                                                                        GLib.timeout_add(0, 100, function() {
+                                                                            _this.activePath = path;
+                                                                            colObj.items[0].el.editable = true; // esp. need for col 0..
+                                                                            _this.get('/LeftPanel.view').el.set_cursor_on_cell(
+                                                                                tp,
+                                                                                colObj.el,
+                                                                                colObj.items[0].el,
+                                                                                true
+                                                                            );
+                                                                        });
+                                                                        
+                                                                    },
+                                                                    toJS : function() {
+                                                                         var iter = new Gtk.TreeIter();
+                                                                        this.get('/LeftPanel.model').el.get_iter_first(iter);
+                                                                        var ar = {};
+                                                                           
+                                                                        while (true) {
+                                                                            
+                                                                            var k = this.getValue(this.el.get_path(iter).to_string(), 0);
+                                                                           // Seed.print(k);
+                                                                            if (k[0] == '!') {
+                                                                                ar.listeners = ar.listeners || {};
+                                                                                ar.listeners[  k.substring(1)] = this.getValue(this.el.get_path(iter).to_string(), 1);
+                                                                                
+                                                                            } else {
+                                                                                ar[ k ] = this.getValue(this.el.get_path(iter).to_string(), 1);
+                                                                            }
+                                                                            
+                                                                            if (! this.get('/LeftPanel.model').el.iter_next(iter)) {
+                                                                                break;
+                                                                            }
+                                                                        }
+                                                                        
+                                                                        
+                                                                        //print(JSON.stringify(ar));
+                                                                        return ar;
+                                                                        // convert the l
+                                                                    },
+                                                                    toShort : function(str) {
+                                                                        var a = typeof(str) == 'string' ? str.split("\n") : [];
+                                                                            return a.length > 1 ? a[0] + '....' : '' + str;
+                                                                    }
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.TreeViewColumn,
+                                                                    pack : "append_column",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                    
+                                                                        this.el.add_attribute(this.items[0].el , 'markup', 2 );
+                                                                        this.get('/LeftPanel').propertyColumn = this;
+                                                                    },
+                                                                    title : "key",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.CellRendererText,
+                                                                            pack : "pack_start",
+                                                                            listeners : {
+                                                                                editing_started : function (self, editable, path) {
+                                                                                
+                                                                                        this.get('/LeftPanel.model').activePath  = path;
+                                                                                
+                                                                                },
+                                                                                edited : function (self, object, p0) {
+                                                                                       var model = this.get('/LeftPanel.model');
+                                                                                        var path = model.activePath;
+                                                                                        var iter = new Gtk.TreeIter();
+                                                                                        model.el.get_iter(iter, new Gtk.TreePath.from_string(path));
+                                                                                        model.el.set_value(iter, 0, p0);
+                                                                                        model.el.set_value(iter, 2, p0);
+                                                                                        
+                                                                                       model.activePath = false;
+                                                                                
+                                                                                       this.get('/LeftTree.model').changed(model.toJS(), true); 
+                                                                                        this.el.editable = false;
+                                                                                }
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.TreeViewColumn,
+                                                                    pack : "append_column",
+                                                                    title : "value",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                       this.el.add_attribute(this.items[0].el , 'text', 3 );
+                                                                       this.el.add_attribute(this.items[0].el , 'sensitive', 3 );
+                                                                       //this.el.add_attribute(this.items[0].el , 'editable', 3 );
+                                                                              // this.el.set_cell_data_func(cell, age_cell_data_func, NULL, NULL);
+                                                                    
+                                                                       this.get('/LeftPanel').editableColumn= this;
+                                                                    },
+                                                                    setOptions : function(ar) {
+                                                                           var m = this.items[0].el.model;
+                                                                                m.clear();
+                                                                                var iter = new Gtk.TreeIter();
+                                                                                ar.forEach(function(i) {
+                                                                                       // sort!!!?
+                                                                                    m.append(iter);
+                                                                                    m.set_value(iter, 0, i);
+                                                                                });
+                                                                                
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.CellRendererCombo,
+                                                                            listeners : {
+                                                                                edited : function (self, object, p0) {
+                                                                                       this.get('/LeftPanel').editing = false;
+                                                                                       var ap = this.get('/LeftPanel.model').activePath
+                                                                                       print("EDITED? "  + ap + " - p:" + p0 + " t:" + p0);
+                                                                                        this.get('/LeftPanel.model').changed(p0, true);
+                                                                                        this.get('/LeftPanel.model').activePath = false;
+                                                                                        this.el.editable = false;
+                                                                                },
+                                                                                editing_started : function (self, editable, path) {
+                                                                                   this.get('/LeftPanel').editing  = true;
+                                                                                       //  console.log('editing started');
+                                                                                       // r.has_entry = false;
+                                                                                
+                                                                                    this.el.editable = false; // make sure it's not editor...
+                                                                                   
+                                                                                }
+                                                                            },
+                                                                            editable : false,
+                                                                            pack : "pack_start",
+                                                                            text_column : 0,
+                                                                            has_entry : true,
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                               this.el.model = new Gtk.ListStore();
+                                                                                this.el.model.set_column_types ( 1, [
+                                                                                    GObject.TYPE_STRING  // 0 real key
+                                                                                  ]);
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Menu,
+                                                            pack : false,
+                                                            id : "LeftPanelPopup",
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.MenuItem,
+                                                                    pack : "append",
+                                                                    label : "Delete",
+                                                                    listeners : {
+                                                                        activate : function (self) {
+                                                                               this.get('/LeftPanel.model').deleteSelected();
+                                                                        }
+                                                                    }
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.MenuItem,
+                                                                    pack : "append",
+                                                                    label : "Edit",
+                                                                    listeners : {
+                                                                        activate : function (self) {
+                                                                               this.get('/LeftPanel.model').startEditing(false, 0);
+                                                                        }
+                                                                    }
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    xtype: Gtk.ScrolledWindow,
+                                    pack : "pack_end,false,true,0",
+                                    id : "MidPropTree",
+                                    shadow_type : Gtk.ShadowType.IN,
+                                    init : function() {
+                                        XObject.prototype.init.call(this);
+                                           XObject.prototype.init.call(this); 
+                                        this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)
+                                        this.el.set_size_request ( 150, -1 );
+                                        this.shown = true;
+                                    },
+                                    activeElement : false,
+                                    hideWin : function() {
+                                         
+                                        if (!this.shown) {
+                                            return;
+                                        }
+                                        
+                                        
+                                        if (this.get('/Window.left').el.position < 160) {
+                                            return;
+                                        }
+                                        this.get('/Window.left').el.position = this.get('/Window.left').el.position  - 150;
+                                            
+                                        this.el.hide();
+                                        this.shown = false;
+                                    },
+                                    items : [
+                                        {
+                                            xtype: Gtk.TreeView,
+                                            listeners : {
+                                                cursor_changed : function (self) {
+                                                       var iter = new Gtk.TreeIter();
+                                                                        
+                                                                        //console.log('changed');
+                                                        var m = this.get('model');
+                                                       if (!this.selection){
+                                                               this.selection = this.el.get_selection();
+                                                       }
+                                                
+                                                        var s = this.selection;
+                                                        if (!s.get_selected(m.el, iter)) {
+                                                               return; 
+                                                       }
+                                                        var tp = m.el.get_path(iter).to_string();
+                                                        
+                                                        
+                                                        // var val = "";
+                                                        
+                                                        var key = m.getValue(tp, 0);
+                                                        
+                                                        var type = m.getValue(tp, 1);
+                                                        var skel = m.getValue(tp, 3);
+                                                        var etype = m.getValue(tp, 5);
+                                                        
+                                                        
+                                                        this.get('/MidPropTree').hideWin();
+                                                
+                                                        if (type.toLowerCase() == 'function') {
+                                                            
+                                                            if (etype != 'events') {
+                                                                key = '|' + key;
+                                                            }
+                                                            
+                                                            this.get('/LeftPanel.model').add({
+                                                                key :  key, 
+                                                                type : type,
+                                                                val  : skel,
+                                                                etype : etype
+                                                            })  
+                                                            return;
+                                                        }
+                                                        // has dot in name, and is boolean???? this does not make sense..
+                                                        //if (type.indexOf('.') > -1 ||  type.toLowerCase() == 'boolean') {
+                                                        //     key = '|' + key;
+                                                       // }
+                                                        
+                                                        this.get('/LeftPanel.model').add( {
+                                                            key : key, 
+                                                            type : type,
+                                                            //skel  : skel,
+                                                            etype : etype
+                                                           }) //, 
+                                                }
+                                            },
+                                            pack : "add",
+                                            tooltip_column : 2,
+                                            enable_tree_lines : true,
+                                            headers_visible : false,
+                                            init : function() {
+                                               XObject.prototype.init.call(this); 
+                                                                
+                                                   var description = new Pango.FontDescription.c_new();
+                                                 description.set_size(8000);
+                                                this.el.modify_font(description);     
+                                                                
+                                                //this.selection = this.el.get_selection();
+                                                // this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                             
+                                            
+                                                
+                                              
+                                                
+                                            },
+                                            items : [
+                                                {
+                                                    xtype: Gtk.ListStore,
+                                                    id : "model",
+                                                    pack : "set_model",
+                                                    getValue : function(treepath, col)
+                                                    {
+                                                        var tp = new Gtk.TreePath.from_string (treepath);
+                                                        var iter = new Gtk.TreeIter();
+                                                        this.el.get_iter (iter, tp);
+                                                        var value = new GObject.Value('');
+                                                        this.el.get_value(iter, col, value);
+                                                        return value.value;
+                                                        
+                                                    },
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_column_types ( 6, [
+                                                            GObject.TYPE_STRING,  // real key
+                                                             GObject.TYPE_STRING, // real type
+                                                             GObject.TYPE_STRING, // docs ?
+                                                             GObject.TYPE_STRING, // visable desc
+                                                             GObject.TYPE_STRING, // function desc
+                                                             GObject.TYPE_STRING // element type (event|prop)
+                                                            
+                                                        ] );
+                                                    },
+                                                    showData : function(type) {
+                                                        this.el.clear();
+                                                                if (!this.get('/MidPropTree').activeElement || !type) {
+                                                                    return; // no active element
+                                                                }
+                                                    
+                                                                var fullpath = this.get('/LeftTree.model').file.guessName(this.get('/MidPropTree').activeElement);
+                                                                var palete = this.get('/LeftTree').getPaleteProvider();
+                                                                
+                                                                 
+                                                                
+                                                                Seed.print('Showing right?');
+                                                                if (!this.get('/MidPropTree').shown) {
+                                                    
+                                                                    this.get('/Window.left').el.position = this.get('/Window.left').el.position  + 150;
+                                                                    this.get('/MidPropTree').el.show();
+                                                                    this.get('/MidPropTree').shown = true;
+                                                                }
+                                                                
+                                                                var elementList = palete.getPropertiesFor(fullpath, type).sort(function(a,b) { 
+                                                                    return a.name >  b.name ? 1 : -1;
+                                                                });
+                                                                print ("GOT " + elementList.length + " items for " + fullpath + "|" + type);
+                                                               // console.dump(elementList);
+                                                               
+                                                                
+                                                                var iter = new Gtk.TreeIter();
+                                                                for(var i =0 ; i < elementList.length; i++) {
+                                                                    var p=elementList[i];
+                                                                    this.el.append(iter);
+                                                                  //  console.log( '<b>' + p.name +'</b> ['+p.type+']');
+                                                                        //GObject.TYPE_STRING,  // real key
+                                                                        // GObject.TYPE_STRING, // real type
+                                                                        // GObject.TYPE_STRING, // docs ?
+                                                                        // GObject.TYPE_STRING // func def?
+                                                                        
+                                                                    
+                                                                    this.el.set_value(iter, 0, p.name);
+                                                                    this.el.set_value(iter, 1, p.type);
+                                                                    this.el.set_value(iter, 2, '<span size="small"><b>' + p.name +'</b> ['+p.type+']</span>' + "\n" + p.desc);
+                                                                    this.el.set_value(iter, 3, p.sig ? p.sig  : '');
+                                                                    this.el.set_value(iter, 4, '<span size="small"><b>' + p.name +'</b> ['+p.type+']</span>');
+                                                                    this.el.set_value(iter, 5, type);
+                                                                    
+                                                                }
+                                                                                 
+                                                    }
+                                                },
+                                                {
+                                                    xtype: Gtk.TreeViewColumn,
+                                                    init : function() {
+                                                        this.el = new Gtk.TreeViewColumn();
+                                                        this.parent.el.append_column(this.el);
+                                                        
+                                                        XObject.prototype.init.call(this);
+                                                        this.el.add_attribute(this.items[0].el , 'markup', 4  );
+                                                    },
+                                                    pack : false,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.CellRendererText,
+                                                            pack : "pack_start,true"
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.HBox,
+                            pack : "add",
+                            items : [
+                                {
+                                    xtype: Gtk.VPaned,
+                                    pack : "add",
+                                    position : 300,
+                                    items : [
+                                        {
+                                            xtype: Gtk.VBox,
+                                            pack : "add",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.Notebook,
+                                                    pack : "pack_start,true,true",
+                                                    id : "view-help-nb",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Preview" }));
+                                                        this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : "Help" }));
+                                                    },
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Notebook,
+                                                            id : "view-notebook",
+                                                            pack : "add",
+                                                            tab_border : 0,
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                                this.el.set_current_page(0);
+                                                                //print("SET LABEL?")
+                                                                this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Roo View" }));
+                                                                this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : "Gtk View" }));
+                                                            },
+                                                            show_tabs : false,
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.VBox,
+                                                                    id : "RightBrowser",
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.HBox,
+                                                                            pack : "pack_start,false,true,0",
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.Button,
+                                                                                    listeners : {
+                                                                                        clicked : function (self) {
+                                                                                          this.get('/RightBrowser.view').renderJS(null,true);
+                                                                                        }
+                                                                                    },
+                                                                                    label : "Redraw",
+                                                                                    pack : "pack_start,false,false,0"
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.CheckButton,
+                                                                                    listeners : {
+                                                                                        toggled : function (self, state) {
+                                                                                            this.el.set_label(this.el.active  ? "Auto Redraw On" : "Auto Redraw Off");
+                                                                                        }
+                                                                                    },
+                                                                                    active : true,
+                                                                                    id : "AutoRedraw",
+                                                                                    label : "Auto Redraw On",
+                                                                                    pack : "pack_start,false,false,0"
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.ScrolledWindow,
+                                                                            pack : "add",
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                                this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                                            },
+                                                                            shadow_type : Gtk.ShadowType.IN,
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: WebKit.WebView,
+                                                                                    listeners : {
+                                                                                        load_finished : function (self, object) {
+                                                                                            print("load finished");
+                                                                                        //    print("load_finished"); return;
+                                                                                               // if (this.ready) { // dont do it twice!
+                                                                                                //   return; 
+                                                                                               //}
+                                                                                               if (!this.inspectorShown) {
+                                                                                                   this.el.get_inspector().show();
+                                                                                                   this.inspectorShown = true;
+                                                                                               }
+                                                                                        
+                                                                                               this.ready = true;
+                                                                                               
+                                                                                                if (this.pendingRedraw) {
+                                                                                                    this.pendingRedraw = false;
+                                                                                                    this.refreshRequired  = true;
+                                                                                                }
+                                                                                                //var js = this.get('/LeftTree.model').toJS();
+                                                                                                //if (js && js[0]) {
+                                                                                               //    this.renderJS(js[0]);
+                                                                                               //}
+                                                                                        
+                                                                                        },
+                                                                                        script_alert : function (self, object, p0) {
+                                                                                            //         print(p0);
+                                                                                                return false;
+                                                                                                return true; // do not display anything...
+                                                                                        },
+                                                                                        console_message : function (self, object, p0, p1) {
+                                                                                            print(object);
+                                                                                           //  console.log(object);
+                                                                                                if (!object.match(/^\{/)) {
+                                                                                                
+                                                                                                    //this.get('/Terminal').feed(object);
+                                                                                                    return true; // do not handle!!! -> later maybe in console..
+                                                                                                }
+                                                                                               // console.log(object);
+                                                                                                var val =  JSON.parse(object);
+                                                                                        
+                                                                                                if (typeof(val['hover-node']) != 'undefined') {
+                                                                                                    this.activeNode = val['hover-node'];
+                                                                                                    console.log('active node: ' + this.activeNode);
+                                                                                                    return true;
+                                                                                                }
+                                                                                        
+                                                                                                 var ret = false;
+                                                                                                 if (typeof(val['id']) != 'undefined') {
+                                                                                                   // this.activeNode = val['id'];
+                                                                                                    var tg = this.get('/LeftTree.model').findDropNode(val['id'], true); 
+                                                                                                    if (!tg || typeof(tg[0]) == 'undefined') {
+                                                                                                        return false;
+                                                                                                    }
+                                                                                                    print("SELECT node " + tg[0]);
+                                                                                                    
+                                                                                                    this.get('/LeftTree.view').selectNode(tg[0]);
+                                                                                                    ret  = true;
+                                                                                                    
+                                                                                                } 
+                                                                                                if (ret && typeof(val['set']) != 'undefined') {
+                                                                                                   this.get('/LeftPanel.model').add({
+                                                                                                        key : val['set'],
+                                                                                                        val : val['value']
+                                                                                                    });
+                                                                                                    //console.log('active node: ' + this.activeNode);
+                                                                                                    
+                                                                                                }
+                                                                                                //Seed.print('a:'+a);
+                                                                                                //Seed.print('b:'+b);
+                                                                                                //Seed.print('c:'+c);
+                                                                                                return ret;
+                                                                                        },
+                                                                                        drag_motion : function (w, ctx,  x,   y,   time, ud) {
+                                                                                           // console.log('DRAG MOTION'); 
+                                                                                                // status:
+                                                                                                // if lastCurrentNode == this.currentNode.. -- don't change anything..
+                                                                                                this.targetData = [];
+                                                                                                this.el.execute_script("Builder.overPos(" + x +','+ y + ");");
+                                                                                                
+                                                                                                // A) find out from drag all the places that node could be dropped.
+                                                                                                var src = Gtk.drag_get_source_widget(ctx);
+                                                                                                if (!src.dropList) {
+                                                                                                    Gdk.drag_status(ctx, 0, time);
+                                                                                                    return true;
+                                                                                                }
+                                                                                                // b) get what we are over.. (from activeNode)
+                                                                                                // tree is empty.. - list should be correct..
+                                                                                                if (!this.get('/LeftTree.model').currentTree) {
+                                                                                                    Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                    return true;
+                                                                                                    
+                                                                                                }
+                                                                                                // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)
+                                                                                                
+                                                                                                var tg = this.get('/LeftTree.model').findDropNode(this.activeNode, src.dropList);
+                                                                                                console.dump(tg);
+                                                                                                if (!tg.length) {
+                                                                                                    Gdk.drag_status(ctx, 0,time);
+                                                                                                    this.get('/LeftTree.view').highlight(false);
+                                                                                                    return true;
+                                                                                                }
+                                                                                                 
+                                                                                                // if we have a target..
+                                                                                                // -> highlight it! (in browser)
+                                                                                                // -> highlight it! (in tree)
+                                                                                                
+                                                                                                Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                this.get('/LeftTree.view').highlight(tg);
+                                                                                                this.targetData = tg;
+                                                                                                // for tree we should handle this...
+                                                                                                return true;
+                                                                                        },
+                                                                                        drag_drop : function (w, ctx, x, y,time, ud) {
+                                                                                               print("TARGET: drag-drop");
+                                                                                                var is_valid_drop_site = true;
+                                                                                                
+                                                                                                 
+                                                                                                Gtk.drag_get_data
+                                                                                                (
+                                                                                                        w,         /* will receive 'drag-data-received' signal */
+                                                                                                        ctx,        /* represents the current state of the DnD */
+                                                                                                        this.get('/Window').atoms["STRING"],    /* the target type we want */
+                                                                                                        time            /* time stamp */
+                                                                                                );
+                                                                                                                
+                                                                                                                
+                                                                                                                /* No target offered by source => error */
+                                                                                                               
+                                                                                        
+                                                                                               return  is_valid_drop_site;
+                                                                                        },
+                                                                                        drag_data_received : function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) 
+                                                                                            {
+                                                                                                print("Browser: drag-data-received");
+                                                                                                var delete_selection_data = false;
+                                                                                                vardnd_success = false;
+                                                                                                /* Deal with what we are given from source */
+                                                                                                if( sel_data && sel_data.length ) {
+                                                                                                    
+                                                                                                    if (ctx.action == Gdk.DragAction.ASK)  {
+                                                                                                        /* Ask the user to move or copy, then set the ctx action. */
+                                                                                                    }
+                                                                                        
+                                                                                                    if (ctx.action == Gdk.DragAction.MOVE) {
+                                                                                                        delete_selection_data = true;
+                                                                                                    }
+                                                                                                    var source = Gtk.drag_get_source_widget(ctx);
+                                                                                        
+                                                                                                    print("Browser: source.DRAGDATA? " + source.dragData);
+                                                                                                    if (this.targetData) {
+                                                                                                        print(this.targetData);
+                                                                                                        this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);
+                                                                                                    }
+                                                                                                    
+                                                                                                    
+                                                                                                    
+                                                                                                    dnd_success = true;
+                                                                                        
+                                                                                                }
+                                                                                        
+                                                                                                if (dnd_success == false)
+                                                                                                {
+                                                                                                        Seed.print ("DnD data transfer failed!\n");
+                                                                                                }
+                                                                                                
+                                                                                                Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
+                                                                                                return true;
+                                                                                            },
+                                                                                        create_web_view : function (self, object) {
+                                                                                          print("CREATE WEB VIEW");
+                                                                                           return null; //new WebKit.WebView();
+                                                                                        }
+                                                                                    },
+                                                                                    redraws : 0,
+                                                                                    id : "view",
+                                                                                    pack : "add",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                        // this may not work!?
+                                                                                        var settings =  this.el.get_settings();
+                                                                                        settings.enable_developer_extras = true;
+                                                                                        
+                                                                                        // this was an attempt to change the url perms.. did not work..
+                                                                                        // settings.enable_file_access_from_file_uris = true;
+                                                                                        // settings.enable_offline_web_application_cache - true;
+                                                                                        // settings.enable_universal_access_from_file_uris = true;
+                                                                                        var _this = this;
+                                                                                         
+                                                                                         // init inspector..
+                                                                                        this.el.get_inspector().signal.inspect_web_view.connect(function(wi, pg) {
+                                                                                             _this.get('/BottomPane.inspector').el.show();
+                                                                                             return _this.get('/BottomPane.inspector').el;
+                                                                                        
+                                                                                        });
+                                                                                         
+                                                                                         // FIXME - base url of script..
+                                                                                         // we need it so some of the database features work.
+                                                                                        this.el.load_html_string( "Render not ready" , 
+                                                                                                //fixme - should be a config option!
+                                                                                                // or should we catch stuff and fix it up..
+                                                                                                'http://localhost/app.Builder/'
+                                                                                        );
+                                                                                            
+                                                                                            
+                                                                                       //this.el.open('file:///' + __script_path__ + '/../builder.html');
+                                                                                                              
+                                                                                        Gtk.drag_dest_set
+                                                                                        (
+                                                                                                this.el,              /* widget that will accept a drop */
+                                                                                                Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,
+                                                                                                null,            /* lists of target to support */
+                                                                                                0,              /* size of list */
+                                                                                                Gdk.DragAction.COPY         /* what to do with data after dropped */
+                                                                                        );
+                                                                                                                
+                                                                                       // print("RB: TARGETS : " + LeftTree.atoms["STRING"]);
+                                                                                        Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);
+                                                                                        
+                                                                                        GLib.timeout_add_seconds(0, 1, function() {
+                                                                                            //    print("run refresh?");
+                                                                                             _this.runRefresh(); 
+                                                                                             return true;
+                                                                                         });
+                                                                                        
+                                                                                        
+                                                                                    },
+                                                                                    renderJS : function(data, force) {
+                                                                                    
+                                                                                        // this is the public redraw call..
+                                                                                        // we refresh in a loop privately..
+                                                                                        var autodraw = this.get('/RightBrowser.AutoRedraw').el.active;
+                                                                                        if (!autodraw && !force) {
+                                                                                            print("Skipping redraw - no force, and autodraw off");
+                                                                                            return;
+                                                                                        }
+                                                                                        this.refreshRequired  = true;
+                                                                                    },
+                                                                                    runRefresh : function() 
+                                                                                    {
+                                                                                        // this is run every 2 seconds from the init..
+                                                                                    
+                                                                                      
+                                                                                        
+                                                                                        if (!this.refreshRequired) {
+                                                                                           // print("no refresh required");
+                                                                                            return;
+                                                                                        }
+                                                                                    
+                                                                                        if (this.lastRedraw) {
+                                                                                           // do not redraw if last redraw was less that 5 seconds ago.
+                                                                                           if (((new Date()) -  this.lastRedraw) < 5000) {
+                                                                                                return;
+                                                                                            }
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        
+                                                                                        
+                                                                                         if (!this.get('/Window.LeftTree').getActiveFile()) {
+                                                                                            return;
+                                                                                         }
+                                                                                         this.refreshRequired = false;
+                                                                                       //  print("HTML RENDERING");
+                                                                                         
+                                                                                         this.get('/BottomPane').el.show();
+                                                                                         this.get('/BottomPane').el.set_current_page(2);// webkit inspector
+                                                                                    
+                                                                                        
+                                                                                        var js = this.get('/LeftTree.model').toJS();
+                                                                                        if (!js || !js.length) {
+                                                                                            print("no data");
+                                                                                            return;
+                                                                                        }
+                                                                                        var  data = js[0];
+                                                                                        this.redraws++;
+                                                                                        
+                                                                                         var project = this.get('/Window.LeftTree').getActiveFile().project;
+                                                                                         //print (project.fn);
+                                                                                         // set it to non-empty.
+                                                                                         project.runhtml  =     project.runhtml  || '';
+                                                                                         project.runhtml  = project.runhtml.length ?  project.runhtml : '<script type="text/javascript"></script>'; 
+                                                                                        
+                                                                                    
+                                                                                         this.runhtml  = this.runhtml || '';
+                                                                                        
+                                                                                         if ((project.runhtml != this.runhtml) || (this.redraws > 10)) {
+                                                                                            // then we need to reload the browser using
+                                                                                            // load_html_string..
+                                                                                            
+                                                                                            // then trigger a redraw once it's loaded..
+                                                                                            this.pendingRedraw = true;
+                                                                                             var runhtml = '<script type="text/javascript">' + "\n" ;
+                                                                                             runhtml +=imports.File.File.read(__script_path__ + '/../builder.html.js') + "\n";
+                                                                                             runhtml += '</script>'+ "\n" ;
+                                                                                            
+                                                                                            this.runhtml = project.runhtml;
+                                                                                            // need to modify paths
+                                                                                            
+                                                                                            
+                                                                                            
+                                                                                            var html = imports.File.File.read(__script_path__ + '/../builder.html');
+                                                                                            html = html.replace('</head>', runhtml + this.runhtml + '</head>');
+                                                                                            print("LOAD HTML " + html);
+                                                                                            this.el.load_html_string( html , 
+                                                                                                //fixme - should be a config option!
+                                                                                                'http://localhost/app.Builder/'
+                                                                                            );
+                                                                                            this.redraws = 0;
+                                                                                            // should trigger load_finished! - which in truns shoudl set refresh Required;
+                                                                                            return;
+                                                                                        
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        this.renderedData = data;
+                                                                                        var str = JSON.stringify(data) ;
+                                                                                        
+                                                                                        if (!this.ready) {
+                                                                                            console.log('not loaded yet');
+                                                                                        }
+                                                                                        this.lastRedraw = new Date();
+                                                                                    
+                                                                                        this.el.execute_script("Builder.render(" + JSON.stringify(data) + ");");
+                                                                                         print( "before render" +    this.lastRedraw);
+                                                                                        print( "after render" +    (new Date()));
+                                                                                        
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.VBox,
+                                                                    id : "RightGtkView",
+                                                                    pack : "add",
+                                                                    redraw : function() {
+                                                                       this.highlightWidget = false;
+                                                                        print("REDRAW CALLED");
+                                                                        this.activePath = this.get('/LeftTree').getActivePath();
+                                                                        if (this.renderedEl) {
+                                                                          print("QUEUE DRAW CALLING");
+                                                                          this.renderedEl.queue_draw();
+                                                                       }
+                                                                    },
+                                                                    renderJS : function(data, withDebug)
+                                                                    {
+                                                                          this.highlightWidget = false;
+                                                                       
+                                                                        this.withDebug = false;
+                                                                        while (this.get('view').el.get_children().length) {
+                                                                            var c = this.get('view').el.get_children()[0];
+                                                                            this.get('view').el.remove(c);        
+                                                                            c.destroy();
+                                                                        }
+                                                                         if (!data) {
+                                                                             return; 
+                                                                        }
+                                                                        
+                                                                        var tree =  this.get('/LeftTree.model').toJS(false,true)[0];
+                                                                        // in theory tree is actually window..  
+                                                                       try {
+                                                                      
+                                                                            this.renderedEl = this.viewAdd(tree.items[0], this.get('view').el);
+                                                                          
+                                                                      } catch (e) {
+                                                                         print(e.message);
+                                                                        return;
+                                                                      }
+                                                                        this.get('view').el.set_size_request(
+                                                                            tree.default_width * 1 || 400, tree.default_height * 1 || 400
+                                                                        ) ;
+                                                                        if (this.renderedEl) {
+                                                                            this.renderedEl.set_size_request(
+                                                                                tree.default_width || 600,
+                                                                                tree.default_height || 400
+                                                                            );
+                                                                        }
+                                                                        this.get('view').el.show_all();
+                                                                        
+                                                                        
+                                                                        
+                                                                    },
+                                                                    showInWindow : function() {
+                                                                      print("GET PROEJCT");
+                                                                       var pr = this.get('/LeftProjectTree').getActiveProject();
+                                                                      
+                                                                       console.log(pr.paths);
+                                                                        return;
+                                                                    /*
+                                                                         var src= this.buildJS(
+                                                                               this.get('/LeftTree.model').toJS()[0], 
+                                                                               true);
+                                                                          // show term?? 
+                                                                    
+                                                                    
+                                                                        //var x = new imports.sandbox.Context();
+                                                                        //x.add_globals();
+                                                                        //print(src);
+                                                                        try {
+                                                                            Seed.check_syntax('var e = ' + src);
+                                                                            //x.eval(src);
+                                                                        } catch( e) {
+                                                                            this.get('/Terminal').feed(e.message || e.toString() + "\n");
+                                                                            this.get('/Terminal').feed(console._dump(e)+"\n");
+                                                                            if (e.line) {
+                                                                                var lines = src.split("\n");
+                                                                                var start = Math.max(0, e.line - 10);
+                                                                                var end = Math.min(lines.length, e.line + 10);
+                                                                                for (var i =start ; i < end; i++) {
+                                                                                    if (i == e.line) {
+                                                                                        this.get('/Terminal').feed(">>>>>" + lines[i] + "\n");
+                                                                                        continue;
+                                                                                    }
+                                                                                    this.get('/Terminal').feed(lines[i] + "\n");
+                                                                                }
+                                                                                
+                                                                            }
+                                                                            
+                                                                            return;
+                                                                        }
+                                                                         this.get('/BottomPane').el.set_current_page(1);
+                                                                        this.get('/Terminal').el.fork_command( null , [], [], "/tmp", false,false,false); 
+                                                                        var cmd = "/usr/bin/seed /tmp/BuilderGtkView.js\n";
+                                                                        this.get('/Terminal').el.feed_child(cmd, cmd.length);
+                                                                         /*
+                                                                        var _top = x.get_global_object()._top;
+                                                                        
+                                                                        _top.el.set_screen(Gdk.Screen.get_default()); // just in case..
+                                                                        _top.el.show_all();
+                                                                        if (_top.el.popup) {
+                                                                            _top.el.popup(null, null, null, null, 3, null);
+                                                                        }
+                                                                    */
+                                                                    },
+                                                                    viewAdd : function(item, par)
+                                                                            {
+                                                                        // does something similar to xobject..
+                                                                        item.pack = (typeof(item.pack) == 'undefined') ?  'add' : item.pack;
+                                                                        
+                                                                        if (item.pack===false || item.pack === 'false') {  // no ;
+                                                                            return;
+                                                                        }
+                                                                        print("CREATE: " + item['|xns'] + '.' + item['xtype']);
+                                                                        var type = item['|xns'] + '.' + item['xtype'];
+                                                                        
+                                                                        if (item['|xns'] == 'GtkClutter') { // we can not add this yet!
+                                                                            return false;
+                                                                        }
+                                                                        var ns = imports.gi[item['|xns']];
+                                                                        var ctr = ns[item['xtype']];
+                                                                        var ctr_args = { };
+                                                                        for(var k in item) {
+                                                                            var kv = item[k];
+                                                                            if (typeof(kv) == 'object' || typeof(kv) == 'function') {
+                                                                                continue;
+                                                                            }
+                                                                            if ( 
+                                                                                k == 'pack' ||
+                                                                                k == 'items' ||
+                                                                                k == 'id' ||
+                                                                                k == 'xtype' ||
+                                                                                k == 'xdebug' ||
+                                                                                k == 'xns' ||
+                                                                                k == '|xns'
+                                                                            ) {
+                                                                                continue;
+                                                                            }
+                                                                    
+                                                                       if (k[0] == '|' && typeof(kv) == 'string') {
+                                                                    
+                                                                               if (kv.match(new RegExp('function'))) {
+                                                                                       continue;
+                                                                                    }
+                                                                                print("WASL " + k + '=' + kv);
+                                                                               try {
+                                                                                       eval( 'kv = ' + kv);
+                                                                               } catch(e) {    continue; }
+                                                                                    
+                                                                               k = k.substring(1);
+                                                                                 // print(k + '=' + kv);
+                                                                       }
+                                                                            if (k[0] == '|') { // should be boolean or number..
+                                                                               k = k.substring(1);
+                                                                               //print(k + '=' + kv);
+                                                                            }
+                                                                             
+                                                                       if (k == 'show_tabs') { // force tab showing for notebooks.
+                                                                               kv = true;
+                                                                            }
+                                                                            print(k + '=' + typeof(kv) + " : " + kv);
+                                                                            ctr_args[k] = kv;
+                                                                            
+                                                                        } 
+                                                                        
+                                                                        
+                                                                        var el = new ctr(ctr_args);
+                                                                        
+                                                                        print("PACK" + item.pack);
+                                                                        //console.dump(item.pack);
+                                                                        
+                                                                        
+                                                                        
+                                                                        
+                                                                        var args = [];
+                                                                        var pack_m  = false;
+                                                                        if (typeof(item.pack) == 'string') {
+                                                                             
+                                                                            item.pack.split(',').forEach(function(e, i) {
+                                                                                
+                                                                                if (e == 'false') { args.push( false); return; }
+                                                                                if (e == 'true') {  args.push( true);  return; }
+                                                                                if (!isNaN(parseInt(e))) { args.push( parseInt(e)); return; }
+                                                                                args.push(e);
+                                                                            });
+                                                                            //print(args.join(","));
+                                                                            
+                                                                            pack_m = args.shift();
+                                                                        } else {
+                                                                            pack_m = item.pack.shift();
+                                                                            args = item.pack;
+                                                                        }
+                                                                        
+                                                                        // handle error.
+                                                                        if (pack_m && typeof(par[pack_m]) == 'undefined') {
+                                                                            throw {
+                                                                                    name: "ArgumentError", 
+                                                                                    message : 'pack method not available : ' + par.id + " : " + par + '.' +  pack_m +
+                                                                                            "ADDING : " + item.id + " " +  el
+                                                                                        
+                                                                           };
+                                                                    
+                                                                            return;
+                                                                        }
+                                                                        
+                                                                        console.dump(args);
+                                                                        args.unshift(el);
+                                                                        //if (XObject.debug) print(pack_m + '[' + args.join(',') +']');
+                                                                        //Seed.print('args: ' + args.length);
+                                                                        if (pack_m) {
+                                                                            par[pack_m].apply(par, args);
+                                                                        }
+                                                                        
+                                                                        var _this = this;
+                                                                        item.items = item.items || [];
+                                                                        item.items.forEach(function(ch,n) {
+                                                                    
+                                                                              print ("type:" + type);
+                                                                              
+                                                                               print ("ch.pack:" + ch.pack);
+                                                                             if (type == 'Gtk.Table' && ch.pack == 'add') {
+                                                                                var c = n % item.n_columns;
+                                                                                var r = Math.floor(n/item.n_columns);
+                                                                                ch.pack = [ 'attach', c, c+1, r, r+1, 
+                                                                                         typeof(ch.x_options) == 'undefined' ?  5 : ch.x_options,
+                                                                                            typeof(ch.y_options) == 'undefined' ?  5 : ch.y_options,
+                                                                                            typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding,
+                                                                                            typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding
+                                                                                ].join(',');
+                                                                            }
+                                                                        
+                                                                            _this.viewAdd(ch, el);
+                                                                        });
+                                                                        
+                                                                        
+                                                                        
+                                                                        // add the signal handlers.
+                                                                        // is it a widget!?!!?
+                                                                       
+                                                                        
+                                                                        try {
+                                                                             
+                                                                            
+                                                                            el.signal.expose_event.connect(XObject.createDelegate(this.widgetExposeEvent, this, [ item  ], true));
+                                                                            el.signal.drag_motion.connect(XObject.createDelegate(this.widgetDragMotionEvent, this,[ item  ], true));
+                                                                            el.signal.drag_drop.connect(XObject.createDelegate(this.widgetDragDropEvent, this, [ item  ], true));
+                                                                            el.signal.button_press_event.connect(XObject.createDelegate(this.widgetPressEvent, this, [ item  ], true ));
+                                                                      el.signal.button_release_event.connect(XObject.createDelegate(this.widgetReleaseEvent, this, [ item  ], true ));
+                                                                        } catch(e) {
+                                                                            // ignore!
+                                                                           }
+                                                                        
+                                                                        
+                                                                        
+                                                                        return el;
+                                                                        
+                                                                    },
+                                                                    widgetDragDropEvent : function() {
+                                                                          print("WIDGET DRAGDROP"); 
+                                                                                return true;
+                                                                    },
+                                                                    widgetDragMotionEvent : function() {
+                                                                         print("WIDGET DRAGMOTION"); 
+                                                                                return true;
+                                                                    },
+                                                                    widgetExposeEvent : function(w, evt, ud, item) {
+                                                                        var widget = w;
+                                                                         if (this.inRender) {
+                                                                             return false;
+                                                                         }
+                                                                         
+                                                                         if ( this.highlightWidget) {
+                                                                              this.inRender = true;
+                                                                              if (item.xtreepath.substring(0, this.activePath.length) == this.activePath) {
+                                                                                     Gdk.draw_rectangle(this.highlightWidget.window, this.gc, false, this.box.x , this.box.y, this.box.w, this.box.h);
+                                                                                }
+                                                                               this.inRender = false;
+                                                                               return false;
+                                                                         }
+                                                                         
+                                                                         
+                                                                         if (this.activePath != item.xtreepath) {
+                                                                            return false;
+                                                                         }
+                                                                         
+                                                                       //  print("HIGHLIGHT: " + item.xtreepath ); // draw highlight??
+                                                                         // work out the coords of the window..
+                                                                         if (!this.gc) {
+                                                                          var dr = widget.window;
+                                                                          this.gc = (new Gdk.GC.c_new(dr));
+                                                                          this.gc.set_rgb_fg_color(new Gdk.Color({ red: 0xFFFF, green: 0, blue : 0 }));
+                                                                          this.gc.set_line_attributes(4,  Gdk.LineStyle.SOLID, Gdk.CapStyle.ROUND , Gdk.JoinStyle.ROUND);
+                                                                        }
+                                                                    
+                                                                        
+                                                                         var r  = evt.expose.area;
+                                                                         // console.dump([r.x, r.y, r.width, r.height ] );
+                                                                         //return false;
+                                                                    //     print(widget.get_parent().toString().match(/GtkScrolledWindow/);
+                                                                         if (widget.get_parent().toString().match(/GtkScrolledWindow/)) { // eak
+                                                                             // happens with gtkscrollview embedded stuff..
+                                                                             var np =this.activePath.split(':');
+                                                                             np.pop();
+                                                                             this.activePath = np.join(':');
+                                                                             this.renderedEl.queue_draw();
+                                                                             return true;
+                                                                    
+                                                                            
+                                                                         }
+                                                                    
+                                                                           
+                                                                         
+                                                                         
+                                                                          this.box = {
+                                                                            x : r.x - 2,
+                                                                            y : r.y - 2,
+                                                                            w: r.width + 4,
+                                                                            h: r.height + 4
+                                                                          }; 
+                                                                          // let's draw it..
+                                                                          this.inRender = true;
+                                                                    
+                                                                          
+                                                                          this.highlightWidget = widget;
+                                                                        
+                                                                        
+                                                                     
+                                                                    
+                                                                        //  print("DRAW BOX");
+                                                                           //console.dump(this.box);
+                                                                          Gdk.draw_rectangle(widget.window, this.gc, false, this.box.x , this.box.y, this.box.w,this.box.h);
+                                                                                this.inRender = false;
+                                                                                return false;
+                                                                    },
+                                                                    widgetPressEvent : function(w,e,u,d) {
+                                                                         if (this.get('view').pressed) {
+                                                                            return false;
+                                                                         }
+                                                                    this.get('view').pressed = true;
+                                                                          print("WIDGET PRESS " + d.xtreepath );       
+                                                                              this.get('/LeftTree.view').selectNode(   d.xtreepath );        
+                                                                                return false;
+                                                                    },
+                                                                    widgetReleaseEvent : function() {
+                                                                        this.get('view').pressed = false;
+                                                                       return false;
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.HBox,
+                                                                            pack : "pack_start,false,true,0",
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.Button,
+                                                                                    pack : "pack_start,false,false,0",
+                                                                                    label : "Run The Application",
+                                                                                    listeners : {
+                                                                                        button_press_event : function (self, event) {
+                                                                                            // call render on left tree - with special option!?!
+                                                                                         
+                                                                                            //print("GET PROEJCT");
+                                                                                            var pr = this.get('/LeftProjectTree').getActiveProject();
+                                                                                          
+                                                                                            var dir = '';
+                                                                                            for (var i in pr.paths) { 
+                                                                                                dir = i;
+                                                                                                break;
+                                                                                            }
+                                                                                            var runner = GLib.path_get_dirname (__script_path__) + '/gtkrun.js'; 
+                                                                                            this.get('/Terminal').feed("RUN DIR:" + dir);
+                                                                                            
+                                                                                            this.get('/Terminal').el.fork_command( null , [], [], GLib.path_get_dirname (__script_path__) 
+                                                                                               , false,false,false); 
+                                                                                            var cmd = "/usr/bin/seed " + runner + " " + dir + "\n";
+                                                                                            this.get('/Terminal').el.feed_child(cmd, cmd.length);
+                                                                                            return false;
+                                                                                          
+                                                                                        
+                                                                                        }
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.ScrolledWindow,
+                                                                            pack : "add",
+                                                                            id : "view-sw",
+                                                                            shadow_type : Gtk.ShadowType.IN,
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                             this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.EventBox,
+                                                                                    pack : "add_with_viewport",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                    this.el.modify_bg(Gtk.StateType.NORMAL, new Gdk.Color({
+                                                                                                red: 0x9F00, green: 0xB800 , blue : 0xA800
+                                                                                               }));
+                                                                                    },
+                                                                                    items : [
+                                                                                        {
+                                                                                            xtype: Gtk.Fixed,
+                                                                                            pack : "add",
+                                                                                            init : function() {
+                                                                                               XObject.prototype.init.call(this);
+                                                                                               //this.el.set_hadjustment(this.parent.el.get_hadjustment());
+                                                                                               //this.el.set_vadjustment(this.parent.el.get_vadjustment());
+                                                                                             
+                                                                                            },
+                                                                                            items : [
+                                                                                                {
+                                                                                                    xtype: Gtk.EventBox,
+                                                                                                    pack : "put,10,10",
+                                                                                                    init : function() {
+                                                                                                       //this.el =     new Gtk.Image.from_stock (Gtk.STOCK_HOME,  Gtk.IconSize.MENU);
+                                                                                                       XObject.prototype.init.call(this);
+                                                                                                    
+                                                                                                                Gtk.drag_dest_set
+                                                                                                                (
+                                                                                                                        this.el,              /* widget that will accept a drop */
+                                                                                                                        Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,
+                                                                                                                        null,            /* lists of target to support */
+                                                                                                                        0,              /* size of list */
+                                                                                                                        Gdk.DragAction.COPY         /* what to do with data after dropped */
+                                                                                                                );
+                                                                                                                
+                                                                                                               // print("RB: TARGETS : " + LeftTree.atoms["STRING"]);
+                                                                                                                Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);
+                                                                                                    },
+                                                                                                    ready : false,
+                                                                                                    getActiveNode : function(x,y)
+                                                                                                    {
+                                                                                                       // workout what node is here..
+                                                                                                        return '0'; // top..
+                                                                                                    },
+                                                                                                    id : "view",
+                                                                                                    listeners : {
+                                                                                                        drag_motion : function (self, ctx, x, y, time) {
+                                                                                                            
+                                                                                                                        // A) find out from drag all the places that node could be dropped.
+                                                                                                                        var src = Gtk.drag_get_source_widget(ctx);
+                                                                                                                        if (!src.dropList) {
+                                                                                                                            Gdk.drag_status(ctx, 0, time);
+                                                                                                                            return true;
+                                                                                                                        }
+                                                                                                                        // b) get what we are over.. (from activeNode)
+                                                                                                                        // tree is empty.. - list should be correct..
+                                                                                                                        if (!this.get('/LeftTree.model').currentTree) {
+                                                                                                                            Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                                            return true;
+                                                                                                                            
+                                                                                                                        }
+                                                                                                                        // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)
+                                                                                                                        var activeNode = this.getActiveNode(x, y);
+                                                                                                                        
+                                                                                                                        
+                                                                                                                        var tg = this.get('/LeftTree.model').findDropNode(activeNode, src.dropList);
+                                                                                                                        console.dump(tg);
+                                                                                                                        if (!tg.length) {
+                                                                                                                            Gdk.drag_status(ctx, 0,time);
+                                                                                                                            this.get('/LeftTree.view').highlight(false);
+                                                                                                                            return true;
+                                                                                                                        }
+                                                                                                                         
+                                                                                                                        // if we have a target..
+                                                                                                                        // -> highlight it! (in browser)
+                                                                                                                        // -> highlight it! (in tree)
+                                                                                                                        
+                                                                                                                        Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                                        this.get('/LeftTree.view').highlight(tg);
+                                                                                                                        this.targetData = tg;
+                                                                                                                        // for tree we should handle this...
+                                                                                                                        return true;
+                                                                                                        },
+                                                                                                        drag_drop : function (self,ctx, x, y, time) {
+                                                                                                               Seed.print("TARGET: drag-drop");
+                                                                                                                var is_valid_drop_site = true;
+                                                                                                                
+                                                                                                                 
+                                                                                                                Gtk.drag_get_data
+                                                                                                                (
+                                                                                                                        self,         /* will receive 'drag-data-received' signal */
+                                                                                                                        ctx,        /* represents the current state of the this.gDnD */
+                                                                                                                        this.get('/Window').atoms["STRING"],    /* the target type we want */
+                                                                                                                        time            /* time stamp */
+                                                                                                                );
+                                                                                                                
+                                                                                                                
+                                                                                                                /* No target offered by source => error */
+                                                                                                               
+                                                                                                        
+                                                                                                                return  is_valid_drop_site;
+                                                                                                          
+                                                                                                        },
+                                                                                                        drag_data_received : function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) 
+                                                                                                            {
+                                                                                                                Seed.print("GtkView: drag-data-received");
+                                                                                                                var delete_selection_data = false;
+                                                                                                                var dnd_success = false;
+                                                                                                                /* Deal with what we are given from source */
+                                                                                                                if( sel_data && sel_data.length ) {
+                                                                                                                    
+                                                                                                                    if (ctx.action == Gdk.DragAction.ASK)  {
+                                                                                                                        /* Ask the user to move or copy, then set the ctx action. */
+                                                                                                                    }
+                                                                                                        
+                                                                                                                    if (ctx.action == Gdk.DragAction.MOVE) {
+                                                                                                                        delete_selection_data = true;
+                                                                                                                    }
+                                                                                                                    var source = Gtk.drag_get_source_widget(ctx);
+                                                                                                        
+                                                                                                                    Seed.print("Browser: source.DRAGDATA? " + source.dragData);
+                                                                                                                    if (this.targetData) {
+                                                                                                                        Seed.print(this.targetData);
+                                                                                                                        this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);
+                                                                                                                    }
+                                                                                                                    
+                                                                                                                    
+                                                                                                                    
+                                                                                                                    dnd_success = true;
+                                                                                                        
+                                                                                                                }
+                                                                                                        
+                                                                                                                if (dnd_success == false)
+                                                                                                                {
+                                                                                                                        Seed.print ("DnD data transfer failed!\n");
+                                                                                                                }
+                                                                                                                
+                                                                                                                Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
+                                                                                                                return true;
+                                                                                                            },
+                                                                                                        button_press_event : function (self, event) {
+                                                                                                          this.pressed = false;
+                                                                                                            return false;
+                                                                                                        }
+                                                                                                    }
+                                                                                                }
+                                                                                            ]
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.ScrolledWindow,
+                                                            id : "Help",
+                                                            pack : "add",
+                                                            show : function() {
+                                                                
+                                                                var file = this.get('/LeftTree').getActiveFile();
+                                                                if (!file) {
+                                                                    return;
+                                                                }
+                                                                var activeEl = this.get('/LeftTree').getActiveElement();
+                                                                var xtype = file.guessName( activeEl )
+                                                                if (!xtype || !xtype.length) {
+                                                                    return;
+                                                                }
+                                                                //this.get('/Window.view-help-nb').el.set_current_page(1);
+                                                                
+                                                                // get the active element being edited.
+                                                                var helpurl = file.getHelpUrl(xtype);       
+                                                                
+                                                                // now load the help info in the page..
+                                                                this.get('help-view').el.open(helpurl);
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: WebKit.WebView,
+                                                                    pack : "add",
+                                                                    id : "help-view",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                       this.get('/Window.help-view').el.open(
+                                                                         "http://devel.akbkhome.com/seed/");
+                                                                    
+                                                                    },
+                                                                    zoom_level : 0.8
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            xtype: Gtk.Notebook,
+                                            id : "BottomPane",
+                                            pack : "add",
+                                            init : function() {
+                                                XObject.prototype.init.call(this);
+                                               //this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Code Editor" }));
+                                                       this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Console" }));
+                                                       this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : "Inspector" }));
+                                            },
+                                            items : [
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    pack : "add",
+                                                    items : [
+                                                        {
+                                                            xtype: Vte.Terminal,
+                                                            pack : "add",
+                                                            id : "Terminal",
+                                                            feed : function(istr) {
+                                                                var str = istr.replace(/\n/g, "\r\n") + "\r\n";
+                                                                // we should make ourselves visable!!!
+                                                                this.get('/BottomPane').el.show();
+                                                                this.get('/BottomPane').el.set_current_page(1);
+                                                            
+                                                                this.el.feed(str ,str.length);
+                                                            },
+                                                            scroll_on_output : true,
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                                this.el.set_size (80, 1000);
+                                                            },
+                                                            scrollback_lines : 1000
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    pack : "add",
+                                                    items : [
+                                                        {
+                                                            xtype: WebKit.WebView,
+                                                            id : "inspector",
+                                                            pack : "add"
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    xtype: Gtk.VBox,
+                                    pack : "pack_start,false,false",
+                                    id : "RightPalete",
+                                    hide : function() {
+                                        
+                                          this.get('buttonbar').el.show();
+                                           this.get('viewbox').el.hide();
+                                        print("TRIED TO HIDE");
+                                    },
+                                    show : function() {
+                                        this.get('buttonbar').el.hide();
+                                        this.get('viewbox').el.show();
+                                       // this.get('model').expanded();
+                                                
+                                    },
+                                    provider : false,
+                                    items : [
+                                        {
+                                            xtype: Gtk.VBox,
+                                            pack : "add",
+                                            id : "buttonbar",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.Button,
+                                                    pack : "pack_start,false,true",
+                                                    listeners : {
+                                                        clicked : function (self) {
+                                                               this.get('/RightPalete').show();
+                                                        }
+                                                    },
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Image,
+                                                            pack : "add",
+                                                            stock : Gtk.STOCK_GOTO_FIRST,
+                                                            icon_size : Gtk.IconSize.MENU
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.Label,
+                                                    pack : "add",
+                                                    label : "Palete",
+                                                    angle : 270,
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                        this.el.add_events ( Gdk.EventMask.BUTTON_MOTION_MASK );
+                                                    },
+                                                    listeners : {
+                                                        enter_notify_event : function (self, event) {
+                                                            this.get('/RightPalete').show();
+                                                            return false;
+                                                        }
+                                                    }
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            xtype: Gtk.VBox,
+                                            pack : "add",
+                                            id : "viewbox",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.HBox,
+                                                    pack : "pack_start,false,true",
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Label,
+                                                            pack : "add",
+                                                            label : "Palete"
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            pack : "pack_start,false,true",
+                                                            listeners : {
+                                                                clicked : function (self) {
+                                                                       this.get('/RightPalete').hide();
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.Image,
+                                                                    pack : "add",
+                                                                    stock : Gtk.STOCK_GOTO_LAST,
+                                                                    icon_size : Gtk.IconSize.MENU
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    pack : "add",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                        this.el.set_size_request(-1,200);
+                                                    },
+                                                    shadow_type : Gtk.ShadowType.IN,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.TreeView,
+                                                            pack : "add",
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                              this.el.set_size_request(150,-1);
+                                                                                      //  set_reorderable: [1]
+                                                                                              
+                                                                        var description = new Pango.FontDescription.c_new();
+                                                                description.set_size(8000);
+                                                                this.el.modify_font(description);
+                                                                
+                                                                this.selection = this.el.get_selection();
+                                                                this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                               // this.selection.signal['changed'].connect(function() {
+                                                                //    _view.listeners['cursor-changed'].apply(_view, [ _view, '']);
+                                                                //});
+                                                                // see: http://live.gnome.org/GnomeLove/DragNDropTutorial
+                                                                 
+                                                                Gtk.drag_source_set (
+                                                                        this.el,            /* widget will be drag-able */
+                                                                        Gdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */
+                                                                        null,            /* lists of target to support */
+                                                                        0,              /* size of list */
+                                                                        Gdk.DragAction.COPY         /* what to do with data after dropped */
+                                                                );
+                                                                //Gtk.drag_source_set_target_list(this.el, LeftTree.targetList);
+                                                               
+                                                                Gtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);
+                                                                Gtk.drag_source_add_text_targets(this.el); 
+                                                                /*
+                                                                print("RP: TARGET:" + LeftTree.atoms["STRING"]);
+                                                                targets = new Gtk.TargetList();
+                                                                targets.add( LeftTree.atoms["STRING"], 0, 0);
+                                                                targets.add_text_targets( 1 );
+                                                                Gtk.drag_dest_set_target_list(this.el, LeftTree.targetList);
+                                                                
+                                                                //if you want to allow text to be output elsewhere..
+                                                                //Gtk.drag_source_add_text_targets(this.el);
+                                                                */
+                                                                return true; 
+                                                            },
+                                                            headers_visible : false,
+                                                            enable_tree_lines : true,
+                                                            listeners : {
+                                                                drag_begin : function (self, ctx) {
+                                                                    // we could fill this in now...
+                                                                        Seed.print('SOURCE: drag-begin');
+                                                                        
+                                                                        
+                                                                        
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        var s = this.selection;
+                                                                        s.get_selected(this.get('/RightPalete.model').el, iter);
+                                                                        var path = this.get('/RightPalete.model').el.get_path(iter);
+                                                                        
+                                                                        var pix = this.el.create_row_drag_icon ( path);
+                                                                            
+                                                                                
+                                                                        Gtk.drag_set_icon_pixmap (ctx,
+                                                                            pix.get_colormap(),
+                                                                            pix,
+                                                                            null,
+                                                                            -10,
+                                                                            -10);
+                                                                        
+                                                                        var value = new GObject.Value('');
+                                                                        this.get('/RightPalete.model').el.get_value(iter, 0, value);
+                                                                        if (!this.get('/RightPalete').provider) {
+                                                                            return false;
+                                                                        }
+                                                                        this.el.dropList = this.get('/RightPalete').provider.getDropList(value.value);
+                                                                        this.el.dragData = value.value;
+                                                                        
+                                                                        
+                                                                        
+                                                                        
+                                                                        return true;
+                                                                },
+                                                                drag_data_get : function (self, drag_context, selection_data, info, time) {
+                                                                       //Seed.print('Palete: drag-data-get: ' + target_type);
+                                                                        if (this.el.dragData && this.el.dragData.length ) {
+                                                                            selection_data.set_text(this.el.dragData ,this.el.dragData.length);
+                                                                        }
+                                                                        
+                                                                        
+                                                                        //this.el.dragData = "TEST from source widget";
+                                                                        
+                                                                        
+                                                                },
+                                                                drag_end : function (self, drag_context) {
+                                                                       Seed.print('SOURCE: drag-end');
+                                                                       this.el.dragData = false;
+                                                                       this.el.dropList = false;
+                                                                       this.get('/LeftTree.view').highlight(false);
+                                                                       return true;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.ListStore,
+                                                                    pack : "set_model",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                    this.el.set_column_types ( 2, [
+                                                                                                GObject.TYPE_STRING, // title 
+                                                                                                GObject.TYPE_STRING // tip
+                                                                                                
+                                                                                                ] );
+                                                                    },
+                                                                    id : "model",
+                                                                    load : function(tr,iter)
+                                                                    {
+                                                                        if (!iter) {
+                                                                            this.el.clear();
+                                                                        }
+                                                                        //console.log('Project tree load: ' + tr.length);
+                                                                        var citer = new Gtk.TreeIter();
+                                                                        //this.insert(citer,iter,0);
+                                                                        for(var i =0 ; i < tr.length; i++) {
+                                                                            if (!iter) {
+                                                                                
+                                                                                this.el.append(citer);   
+                                                                            } else {
+                                                                                this.el.insert(citer,iter,-1);
+                                                                            }
+                                                                            
+                                                                            var r = tr[i];
+                                                                            //Seed.print(r);
+                                                                            this.el.set_value(citer, 0,  '' +  r ); // title 
+                                                                            
+                                                                            //this.el.set_value(citer, 1,  new GObject.Value( r)); //id
+                                                                            //if (r.cn && r.cn.length) {
+                                                                            //    this.load(r.cn, citer);
+                                                                            //}
+                                                                        }
+                                                                        
+                                                                        
+                                                                    },
+                                                                    getValue : function (iter, col) {
+                                                                        var gval = new GObject.Value('');
+                                                                         this.el.get_value(iter, col ,gval);
+                                                                        return  gval.value;
+                                                                        
+                                                                        
+                                                                    }
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.TreeViewColumn,
+                                                                    pack : "append_column",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                       this.el.add_attribute(this.items[0].el , 'markup', 0 );
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.CellRendererText,
+                                                                            pack : "pack_start"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                }
+            ]
+        }
+    ]
+});
+Window.init();
+XObject.cache['/Window'] = Window;

diff --git a/File.js b/File.js
new file mode 100644 (file)
index 0000000..4c98468
--- /dev/null
+++ b/File.js
@@ -0,0 +1,234 @@
+// <script type ="text/Javascript">
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+
+
+
+/**
+* @namespace File
+* 
+* Library to wrap GLib and Gio basic File related methods
+* 
+* usage:
+* 
+* File = import.File.File;
+* 
+* var contents = File.read("/tmp/test.txt");
+*
+* 
+* 
+*/
+var File = {
+
+    SEPARATOR : '/',
+
+    join : function () {
+        // fixme!
+        imports['String.js'].load(String);
+        
+        var out = "";
+        for (var i = 0; i < arguments.length; i++) {
+            if (i == 0) {
+              out += arguments[i].rtrim(File.SEPARATOR);
+            }
+            else if (i == arguments.length - 1) {
+              out += File.SEPARATOR + arguments[i].ltrim(File.SEPARATOR);
+            }
+            else {
+              out += File.SEPARATOR + arguments[i].trim(File.SEPARATOR);
+            }
+        }
+        return out;
+    },
+
+    read : function (path) {
+        var out = {};
+        GLib.file_get_contents(path, out, null, null);
+        return out['value'];
+    },
+
+    isFile : function (path) {
+      return GLib.file_test(path, GLib.FileTest.IS_REGULAR);
+    },
+    exists : function (path) {
+      return GLib.file_test(path, GLib.FileTest.EXISTS);
+    },
+    isDirectory : function (path) {
+      return GLib.file_test(path, GLib.FileTest.IS_DIR);
+    },
+
+    list : function (path) {
+        var listing = [];
+
+        var f = Gio.file_new_for_path(String(path));
+        var file_enum = f.enumerate_children(Gio.FILE_ATTRIBUTE_STANDARD_DISPLAY_NAME, Gio.FileQueryInfoFlags.NONE, null);
+
+        var next_file = null;
+
+        while ((next_file = file_enum.next_file(null)) != null) {
+          listing.push(next_file.get_display_name());
+        }
+
+        file_enum.close(null);
+
+        listing.sort();
+
+        return listing;
+    },
+
+    mtime : function (path) {
+        var f = Gio.file_new_for_path(String(path));
+        var mtime = new GLib.TimeVal();
+
+        var info = f.query_info(Gio.FILE_ATTRIBUTE_TIME_MODIFIED, Gio.FileQueryInfoFlags.NONE, null);
+        info.get_modification_time(mtime);
+
+        return new Date(mtime.tv_sec * 1000);
+    },
+
+    /**
+     * resolve the real path
+     * @arg path {String} Path to resolve
+     * @returns {String} the resolved path path.
+     * 
+     */
+    realpath :  function (path) { 
+        return this.canonical(path);
+    },
+    canonical : function (path) { 
+        var f = Gio.file_new_for_path(String(path));
+        var can = f.resolve_relative_path('');
+        return can.get_path();
+    },
+    /**
+     * write a string to a file
+     * @arg path {String} File to write to alwasy overwrites.
+     * @arg string {String} Contents of file.
+     * 
+     */
+    write : function (path, string) {
+        var d = new Date();
+        var f = Gio.file_new_for_path(String(path));
+        var data_out = new Gio.DataOutputStream({base_stream:f.replace(null, false, Gio.FileCreateFlags.NONE, null)});
+        data_out.put_string(string, null);
+        data_out.close(null);
+        print("WRITE : " + path + " in " + ((new Date()) - d) + 'ms');
+        
+    },
+    /**
+     * append
+     * @arg path {String} File to write to
+     * @arg string {String} string to append to file.
+     * 
+     */
+    append : function (path, string) {
+        var f = Gio.file_new_for_path(String(path));
+        var data_out = new Gio.DataOutputStream({
+                base_stream:f.append_to(Gio.FileCreateFlags.NONE, null)
+        });
+        data_out.put_string(string, null);
+        data_out.close(null);
+    },
+    /**
+     * remove 
+     * Delete a file.
+     * @arg path {String} File to remove
+     * 
+     * 
+     */
+    remove : function (path)
+    {
+        var f = Gio.file_new_for_path(String(path));
+        return f['delete']();
+    },
+    // copy files recursively from fromDir, silently ignore them if they already exist in toDir
+    silentRecursiveCopy : function (fromDir, toDir) {
+        var filesToCopy = File.recursiveListing(fromDir);
+        var srcPath, destPath, src, dest;
+
+        for (var index in filesToCopy) {
+          srcPath = File.join(String(fromDir), filesToCopy[index]);
+          destPath = File.join(String(toDir), filesToCopy[index]);
+
+          if (File.isFile(srcPath) && !File.isFile(destPath)) {
+            File.copyFile(srcPath, destPath);
+          }
+          else if (File.isDirectory(srcPath) && !File.isDirectory(destPath)) {
+            File.mkdir(destPath);
+          }
+
+        }
+    },
+    /**
+     * Make a symbolic link
+     * @arg  new_link {String} The new link
+     * @arg  target    {String} Where it links to.
+     */
+    link : function (new_link, target) {
+        var dest = Gio.file_new_for_path(String(new_link));
+        return dest.make_symbolic_link(target, null);
+    },
+    /**
+     * Make a directory
+     * FIXME - needs perms setting..
+     * 
+     * @arg  directory  {String} Directory to make
+     */
+
+    mkdir : function (destPath) {
+        var dest = Gio.file_new_for_path(String(destPath));
+        return dest.make_directory(null);
+    },
+
+    /**
+     * Copy a file or (directory maybe?)
+     * @arg  srcPath {String} source file
+     * @arg  destPath {String} destination file
+     * @arg  flags {Gio.FileCopyFlags} to overwrite etc...  Gio.FileCopyFlags.OVERWRITE
+     */
+    copy : function (srcPath, destPath, flags) {
+        return this.copyFile(srcPath, destPath, flags);
+    },
+    copyFile : function (srcPath, destPath, flags) {
+        
+        flags = typeof(flags) == 'undefined' ? Gio.FileCopyFlags.NONE : flags;
+        var dest = Gio.file_new_for_path(String(destPath));
+        var src = Gio.file_new_for_path(String(srcPath));
+
+        // a bit of a hack for the fact that Gio.File.copy arguments
+        // can be nulled, but not according to the GIR file
+        return src.copy(dest, flags);
+    },
+    
+    
+    
+
+    recursiveListing : function (dir) {
+
+        function recursiveListingInternal(prefix, listing, dir) {
+          var entries = File.list(dir);
+          var next, fullPath;
+
+          for (var index in entries) {
+            next = entries[index];
+            fullPath = File.join(prefix, dir, next);
+
+            if (File.isDirectory(fullPath)) {
+              listing.push(next);
+              listing = listing.concat(recursiveListingInternal(next, [], fullPath));
+            }
+            else {
+              if (prefix) {
+                next = File.join(prefix, next);
+              }
+              listing.push(next);
+            }
+          }
+
+          return listing;
+        }
+
+        return recursiveListingInternal('', [], dir);
+    }
+
+};

diff --git a/Sample/About.bjs b/Sample/About.bjs
new file mode 100644 (file)
index 0000000..a304008
--- /dev/null
+++ b/Sample/About.bjs
@@ -0,0 +1,24 @@
+{
+    "id": "file-gtk-8",
+    "name": "About",
+    "parent": "",
+    "title": false,
+    "path": "/home/alan/gitlive/app.Builder.js/Sample/About.bjs",
+    "items": [
+        {
+            "listeners": {
+                "response": "function (self, response_id) {\n    this.el.hide();\n}",
+                "delete_event": "function (self, event) {\n    this.el.hide();\n    return true;\n}"
+            },
+            "authors": "Alan Knowles",
+            "copyright": "LGPL",
+            "license": "LGPL",
+            "program_name": "app.Builder.js",
+            "website": "http://www.akbkhome.com/blog.php",
+            "xtype": "AboutDialog",
+            "|modal": true,
+            "|xns": "Gtk"
+        }
+    ],
+    "permname": ""
+}
\ No newline at end of file

diff --git a/Sample/About.js b/Sample/About.js
new file mode 100644 (file)
index 0000000..ee29392
--- /dev/null
+++ b/Sample/About.js
@@ -0,0 +1,32 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+About=new XObject({
+    xtype: Gtk.AboutDialog,
+    listeners : {
+        response : function (self, response_id) {
+            this.el.hide();
+        },
+        delete_event : function (self, event) {
+            this.el.hide();
+            return true;
+        }
+    },
+    authors : "Alan Knowles",
+    copyright : "LGPL",
+    license : "LGPL",
+    program_name : "app.Builder.js",
+    website : "http://www.akbkhome.com/blog.php",
+    modal : true
+});
+About.init();
+XObject.cache['/About'] = About;

diff --git a/Sample/Window.bjs b/Sample/Window.bjs
new file mode 100644 (file)
index 0000000..fdbeb68
--- /dev/null
+++ b/Sample/Window.bjs
@@ -0,0 +1,1186 @@
+{
+    "id": "file-gtk-1",
+    "name": "Window",
+    "parent": "",
+    "title": false,
+    "path": "/home/alan/gitlive/app.Builder.js/Sample/Window.bjs",
+    "items": [
+        {
+            "listeners": {
+                "delete_event": "function (self, event) {\n    return false;\n}",
+                "destroy": "function (self) {\n   Gtk.main_quit();\n}",
+                "show": "function (self) {\n  print(\"WINDOW SHOWING - trying to hide\");\nimports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();\n \tthis.get('/MidPropTree').hideWin();\n    this.get('/RightPalete').hide();\n    this.get('/BottomPane').el.hide();\n    //this.get('/Editor').el.show_all();\n\n}"
+            },
+            "border_width": 0,
+            "default_height": 500,
+            "default_width": 800,
+            "id": "Window",
+            "title": "Application Builder",
+            "xtype": "Window",
+            "|init": "function() {\n     this.atoms = {\n           \"STRING\" : Gdk.atom_intern(\"STRING\")\n\t};\n\tthis.targetList = new Gtk.TargetList();\n\tthis.targetList.add( this.atoms[\"STRING\"], 0, 0);\n\t//imports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();\nGtk.rc_parse_string(\n            \"style \\\"gtkcombobox-style\\\" {\\n\" + \n            \"    GtkComboBox::appears-as-list = 1\\n\" +\n            \"}\\n\"+\n            \"class \\\"GtkComboBox\\\" style \\\"gtkcombobox-style\\\"\\n\");\n    XObject.prototype.init.call(this);\n    this.el.show_all();\n    \n   \n              \n}\n",
+            "|setTitle": "function(str) {\n    this.el.set_title(this.title + ' - ' + str);\n}\n",
+            "|type": "Gtk.WindowType.TOPLEVEL",
+            "|xns": "Gtk",
+            "items": [
+                {
+                    "|xns": "Gtk",
+                    "xtype": "VBox",
+                    "id": "w-vbox",
+                    "items": [
+                        {
+                            "|xns": "Gtk",
+                            "xtype": "MenuBar",
+                            "pack": "pack_start,false,false",
+                            "items": [
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "MenuItem",
+                                    "|use_underline": true,
+                                    "label": "_File",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "label": "New _Project",
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n         var _this = this;\n\tthis.get('/EditProject').show({\n\t    success : function(pr) {\n\t\t     _this.get('/LeftProjectTree').get('combo').setValue(pr.fn);\n\t    }\n\t});\n}"
+                                                    }
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "label": "_New File",
+                                                    "|use_underline": true,
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n \tvar fn = this.get('/LeftProjectTree.combo').getValue();\n        if (!fn) {\n            this.get('/LeftProjectTree').showNoProjectSelected();\n            return true;\n        }\n        var pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n        this.get('/DialogNewComponent').show({\n            project : pm.getByFn(fn)\n        });\n}"
+                                                    }
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "SeparatorMenuItem",
+                                                    "pack": "add"
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "pack": "add",
+                                                    "label": "D_elete Project",
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n\n\tvar fn =  this.get('/LeftProjectTree').get('combo').getValue();\n\tif (!fn.length) {\n\t\tthis.get('/StandardErrorDialog').show(\"Select a project\")\n\t\treturn;\n        }\n\tvar pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n\tvar pr  = pm.getByFn(fn);\n\n\t// confirm..\n\tthis.get('/DialogConfirm').show(\"Are you sure you want to delete project '\" + pr.name + \"'\", function() {\n\t\tpm.deleteProject(fn);\n\t\tprint(\"DELETE?\");\n\t});\n\n}"
+                                                    }
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "SeparatorMenuItem",
+                                                    "pack": "add"
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "pack": "add",
+                                                    "label": "_Quit",
+                                                    "|use_underline": true,
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n   Gtk.main_quit();\n} "
+                                                    }
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "label": "_Edit",
+                                    "xtype": "MenuItem",
+                                    "|use_underline": true,
+                                    "|xns": "Gtk",
+                                    "pack": "add",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "listeners": {},
+                                            "items": [
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n \tvar fn = this.get('/LeftTree').getActiveFile();\n        if (!fn) {\n            this.get('/StandardErrorDialog').show(\"No File active\");\n            return true;\n        }\n \n        this.get('/DialogNewComponent').show(fn);\n        return true;\n}"
+                                                    },
+                                                    "label": "File _Properties",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                },
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self, event) {\n    this.get('/RooProjectProperties').show();\n    return false;\n}"
+                                                    },
+                                                    "label": "Modify Project HTML ",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "label": "_View",
+                                    "xtype": "MenuItem",
+                                    "|use_underline": true,
+                                    "|xns": "Gtk",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "listeners": {},
+                                            "items": [
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self, event) {\n      var js = this.get('/LeftTree.model').toJS();\n    if (js && js[0]) {\n        this.get('/RightBrowser.view').renderJS(js[0], true);\n    } \n    return false;\n}"
+                                                    },
+                                                    "label": "_Redraw (Roo)",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                },
+                                                {
+                                                    "listeners": {
+                                                        "activate": "function (self, event) \n{\n        /* Firefox testing for debugging..\n          - we can create a /tmp directory, and put.\n            builder.html, builder.html.js, link roojs1 \n            add at the end of builder.html Roo.onload(function() {\n\t  */\n\t if (!this.get('/Window.LeftTree').getActiveFile()) {\n            return;\n        }\n        \n        var js = this.get('/LeftTree.model').toJS();\n         if (!js ||  !js[0]) {\n            return;\n        }\n        var project = this.get('/Window.LeftTree').getActiveFile().project;\n        //print (project.fn);\n        \n        project.runhtml  = project.runhtml || '';\n\n\n\tvar File = imports.File.File;\n\t\n\tvar target = \"/tmp/firetest\"; // fixme..\n\tif (!File.isDirectory(target)) {\n\t    File.mkdir(target);\n        }\n\tFile.copy(__script_path__ + '/../builder.html.js', target+ '/builder.html.js', Gio.FileCopyFlags.OVERWRITE);\n\tif (!File.exists( target+ '/roojs1')) {\n            File.link( target+ '/roojs1', __script_path__ + '/../roojs1');\n    \t}\n        \n        \n        \n        var html = imports.File.File.read(__script_path__ + '/../builder.html');\n        html = html.replace('</head>', project.runhtml + '</head>');\n        \n       \n        var     jsstr = JSON.stringify(js[0], null, 4);\n       \n        var runbuilder = '<script type=\"text/javascript\">' + \"\\n\" + \n            \" Builder.render(\" + jsstr + \");\\n\" +\n            '</script>';\n        \n        html = html.replace('</body>', runbuilder + '</body>');\n\n\tFile.write( target+ '/builder.html', html);\n\t\n        this.get('/Terminal').feed(\"RUN DIR:\" + target);\n    \n    this.get('/Terminal').el.fork_command( null , [], [], target\n\t, false,false,false); \n    var cmd = \"firefox file://\" + target + \"/builder.html  \\n\";\n    this.get('/Terminal').el.feed_child(cmd, cmd.length);\n     return false;\n}"
+                                                    },
+                                                    "label": "_Test in Firefox (Roo)",
+                                                    "pack": "add",
+                                                    "xtype": "MenuItem",
+                                                    "|use_underline": true,
+                                                    "|xns": "Gtk"
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "MenuItem",
+                                    "label": "_Help",
+                                    "|use_underline": true,
+                                    "listeners": {},
+                                    "pack": "add",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "Menu",
+                                            "pack": "set_submenu",
+                                            "listeners": {},
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "MenuItem",
+                                                    "pack": "add",
+                                                    "label": "_About",
+                                                    "|use_underline": true,
+                                                    "listeners": {
+                                                        "activate": "function (self) {\n    this.get('/About').el.run();\n}"
+                                                    }
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            "|xns": "Gtk",
+                            "xtype": "HPaned",
+                            "id": "left",
+                            "position": 400,
+                            "items": [
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "HBox",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "VPaned",
+                                            "position": 300,
+                                            "id": "leftvpaned",
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "id": "LeftTopPanel",
+                                                    "items": [
+                                                        {
+                                                            "listeners": {
+                                                                "activate": "function (self) {\n    // this does not actually expand it..\n    // that is done by GTK..\n    \n    \n \tif (!this.get('/Editor').save()) {\n \t    // popup!! - click handled.. \n \t    return true;\n        }\n\n    if (!this.el.expanded) {\n        this.onExpand();\n    } else {\n        this.onCollapse();\n    }\n\t  \n}",
+                                                                "enter_notify_event": "function (self, event) {\nreturn;\n     this.el.expanded = !this.el.expanded;\n//if (this.el.expanded ) {\n    this.listeners.activate.call(this);\n//   }\n\nreturn true;\n}"
+                                                            },
+                                                            "id": "expander",
+                                                            "label": "Select Project or File",
+                                                            "pack": "pack_start,false,true",
+                                                            "xtype": "Expander",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.add_events (Gdk.EventMask.BUTTON_MOTION_MASK );\n}\n",
+                                                            "|onCollapse": "function() {\n    \n    var nb = this.get('/LeftTopPanel.notebook');\n    nb.el.set_current_page(0);\n}\n",
+                                                            "|onExpand": "function() {\n    var nb = this.get('/LeftTopPanel.notebook');            \n    var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;\n    \n   \n    var model = this.get('/LeftProjectTree.combomodel');\n    //  print (\"loading Projects?\")\n    //console.dump(pm.projects);\n    model.loadData(pm.projects);\n     \n    \n    nb.el.set_current_page(1);\n    //pm.on('changed', function() {\n\t//console.log(\"CAUGHT project manager change\");\n    //    _combo.model.loadData(pm.projects);\n    //}\n    return;\n}\n",
+                                                            "|xns": "Gtk"
+                                                        },
+                                                        {
+                                                            "id": "notebook",
+                                                            "pack": "pack_start,true,true",
+                                                            "xtype": "Notebook",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.set_current_page(0);\n\n}\n",
+                                                            "|show_border": false,
+                                                            "|show_tabs": false,
+                                                            "|xns": "Gtk",
+                                                            "items": [
+                                                                {
+                                                                    "id": "LeftTree",
+                                                                    "pack": "add",
+                                                                    "xtype": "ScrolledWindow",
+                                                                    "|getActiveElement": "function() { // return path to actie node.\n\n     var path = this.getActivePath();\n     if (!path) {\n        return false;\n     }\n     var iter = new Gtk.TreeIter();\n     this.get('model').el.get_iter_from_string(iter, path);\n     \n     var value = new GObject.Value('');\n     this.get('model').el.get_value(iter, 2, value);\n        \n     return JSON.parse(value.value);\n}\n",
+                                                                    "|getActiveFile": "function() {\n    return this.get('model').file;\n}\n",
+                                                                    "|getActivePath": "function() {\n    var model = this.get('model');\n    var view = this.get('view');\n    if (view.selection.count_selected_rows() < 1) {\n        return false;\n    }\n    var iter = new Gtk.TreeIter();\n\n    view.selection.get_selected(model.el, iter);\n    return model.el.get_path(iter).to_string();\n}\n",
+                                                                    "|getPaleteProvider": "function() {\n    var model = this.get('model');\n    var pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n    return pm.getPalete(model.file.getType());\n}\n",
+                                                                    "|getRenderer": "function() {\n\n\tswitch( this.getActiveFile().getType()) {\n\t\tcase 'Roo':\n\t\t    return this.get('/RightBrowser.view');\n\t\tcase 'Gtk':\n\t\t    return this.get('/RightGtkView');\n\t}\n\n}\n",
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)\n}\n",
+                                                                    "|renderView": "function() {\n    var render = this.getRenderer();\n    var model = this.get('model');\n    if (render) {\n        render.renderJS(model.toJS(false,true)[0]);\n    } else {\n        print(\"NO RENDER JS METHOD?\");\n    }\n}\n",
+                                                                    "|shadow_type": "Gtk.ShadowType.IN",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "listeners": {
+                                                                                "button_press_event": "function (self, ev) {\n \tconsole.log(\"button press?\");\n \t\n \tif (!this.get('/Editor').save()) {\n \t    // popup!! - click handled.. \n \t    return true;\n        }\n \t\n        if (ev.type != Gdk.EventType.BUTTON_PRESS  || ev.button.button != 3) {\n            print(\"click\" + ev.type);\n            return false;\n        }\n      \n    \n        var res = {}; \n        this.get('/LeftTree.view').el.get_path_at_pos(ev.button.x,ev.button.y, res);\n        \n        if (!this.get('/LeftTreeMenu').el)  { this.get('/LeftTreeMenu').init(); }\n        \n        this.get('/LeftTreeMenu').el.set_screen(Gdk.Screen.get_default());\n        this.get('/LeftTreeMenu').el.show_all();\n        this.get('/LeftTreeMenu').el.popup(null, null, null, null, 3, ev.button.time);\n        print(\"click:\" + res.path.to_string());\n        return false;\n}",
+                                                                                "drag_begin": "function (self, drag_context) {\n\tprint('SOURCE: drag-begin');\n         this.targetData = false;\n        // find what is selected in our tree...\n        var iter = new Gtk.TreeIter();\n        var s = this.selection;\n        s.get_selected(this.get('/LeftTree.model').el, iter);\n\n        // set some properties of the tree for use by the dropped element.\n        var value = new GObject.Value('');\n        this.get('/LeftTree.model').el.get_value(iter, 2, value);\n        var data = JSON.parse(value.value);\n        var xname = this.get('/LeftTree.model').file.guessName(data);\n        \n        this.el.dragData = xname;\n        this.el.dropList = this.get('/LeftTree').getPaleteProvider().getDropList(xname);\n        \n\n        // make the drag icon a picture of the node that was selected\n        var path = this.get('/LeftTree.model').el.get_path(iter);\n        this.el.treepath = path.to_string();\n        \n        var pix = this.el.create_row_drag_icon ( path);\n        \n        Gtk.drag_set_icon_pixmap (ctx,\n            pix.get_colormap(),\n            pix,\n            null,\n            -10,\n            -10);\n        \n        return true;\n}",
+                                                                                "drag_end": "function (self, drag_context) {\n\tSeed.print('LEFT-TREE: drag-end');\n        this.el.dragData = false;\n        this.el.dropList = false;\n        this.targetData = false;\n        this.get('/LeftTree.view').highlight(false);\n        return true;\n}",
+                                                                                "drag_motion": "function (self, ctx, x, y, time) {\n    console.log(\"LEFT-TREE: drag-motion\");\n                var src = Gtk.drag_get_source_widget(ctx);\n\n                // a drag from  elsewhere...- prevent drop..\n                if (!src.dragData) {\n                    print(\"no drag data!\");\n                    Gdk.drag_status(ctx, 0, time);\n                    this.targetData = false;\n                    return true;\n                }\n                var action = Gdk.DragAction.COPY;\n                if (src == this.el) {\n                    // unless we are copying!!! ctl button..\n                    action = ctx.actions & Gdk.DragAction.MOVE ? Gdk.DragAction.MOVE : Gdk.DragAction.COPY ;\n                }\n                var data = {};\n\n\t\tif (!this.get('/LeftTree.model').el.iter_n_children(null)) {\n\t\t\t// no children.. -- asume it's ok..\n\t\t\tthis.targetData =  [ '' , Gtk.TreeViewDropPosition.INTO_OR_AFTER , ''];\n\t\t\tGdk.drag_status(ctx, action ,time);\n\t\t\treturn true;\n\t\t}\n\n                print(\"GETTING POS\");\n                var isOver = this.get('/LeftTree.view').el.get_dest_row_at_pos(x,y, data);\n                print(\"ISOVER? \" + isOver);\n                if (!isOver) {\n                    Gdk.drag_status(ctx, 0 ,time);\n                    return false; // not over apoint!?!\n                }\n                // drag node is parent of child..\n                console.log(\"SRC TREEPATH: \" + src.treepath);\n                console.log(\"TARGET TREEPATH: \" + data.path.to_string());\n                \n                // nned to check a  few here..\n                //Gtk.TreeViewDropPosition.INTO_OR_AFTER\n                //Gtk.TreeViewDropPosition.INTO_OR_BEFORE\n                //Gtk.TreeViewDropPosition.AFTER\n                //Gtk.TreeViewDropPosition.BEFORE\n                \n                if (typeof(src.treepath) != 'undefined'  && \n                    src.treepath == data.path.to_string().substring(0,src.treepath.length)) {\n                    print(\"subpath drag\");\n                     Gdk.drag_status(ctx, 0 ,time);\n                    return false;\n                }\n                \n                // check that \n                //print(\"DUMPING DATA\");\n                //console.dump(data);\n                // path, pos\n                \n                print(data.path.to_string() +' => '+  data.pos);\n                var tg = this.get('/LeftTree.model').findDropNodeByPath(\n                    data.path.to_string(), src.dropList, data.pos);\n                    \n                this.get('/LeftTree.view').highlight(tg);\n                if (!tg.length) {\n                    print(\"Can not find drop node path\");\n                    this.targetData = false;\n                    Gdk.drag_status(ctx, 0, time);\n                    return true;\n                }\n                //console.dump(tg);\n                this.targetData = tg;    \n                \n                \n                Gdk.drag_status(ctx, action ,time);\n                 \n                return true;\n}",
+                                                                                "drag_drop": "function (w, ctx, x, y, time) {\n      Seed.print(\"TARGET: drag-drop\");\n                       \n                        Gtk.drag_get_data\n                        (\n                                w,         /* will receive 'drag-data-received' signal */\n                                ctx,        /* represents the current state of the DnD */\n                                this.get('/Window').atoms[\"STRING\"],    /* the target type we want */\n                                time            /* time stamp */\n                        );\n                        \n                         \n                        /* No target offered by source => error */\n                       \n\n                        return  true;\n}",
+                                                                                "drag_data_received": "function (self, ctx, x, y, sel_data, info, time) {\n\t print(\"Tree: drag-data-received\");\n\n              var   delete_selection_data = false;\n               var  dnd_success = false;\n                /* Deal with what we are given from source */\n                if( sel_data && sel_data.length ) {\n                    \n                    if (ctx.action == Gdk.DragAction.ASK)  {\n                        /* Ask the user to move or copy, then set the ctx action. */\n                    }\n\n                    if (ctx.action == Gdk.DragAction.MOVE) {\n                        //delete_selection_data = true;\n                    }\n                    \n                    var source = Gtk.drag_get_source_widget(ctx);\n\n                    if (this.targetData) {\n                        if (source != this.el) {\n                            this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);\n                        } else {\n                            // drag around.. - reorder..\n                             this.get('/LeftTree.model').moveNode(this.targetData, ctx.action);\n                            \n                            \n                        }\n                        //Seed.print(this.targetData);\n                      \n                    }\n                    \n                    \n                    \n                    // we can send stuff to souce here...\n\n                    dnd_success = true;\n\n                }\n\n                if (dnd_success == false)\n                {\n                        Seed.print (\"DnD data transfer failed!\\n\");\n                }\n\n                Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);\n                return true;\n}",
+                                                                                "cursor_changed": "function (self) {\n     if (this.blockChanges) { // probably not needed.. \n       return true;\n     }\n     var render = this.get('/LeftTree').getRenderer();                \n   \n    \n    if (this.selection.count_selected_rows() < 1) {\n        this.get('/LeftPanel.model').load( false);\n        this.get('/MidPropTree').activeElement =  false;\n        this.get('/MidPropTree').hideWin();\n\n        var pm = this.get('/RightPalete.model');\n        if (!this.get('/LeftTree').getPaleteProvider()) {\n            // it may not be loaded yet..\n            return  true;\n        }\n        pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(\n            this.get('/LeftTree.model').listAllTypes()));\n        if (render && render.redraw) {\n            render.redraw();\n        }\n        return true;\n    }\n            \n            //console.log('changed');\n        var s = this.selection;\n          var iter = new Gtk.TreeIter();\n        s.get_selected(this.get('/LeftTree.model').el, iter);\n        \n        \n        // var val = \"\";\n        var value = new GObject.Value('');\n        this.get('/LeftTree.model').el.get_value(iter, 2, value);\n        this.get('/LeftTree.model').activePath = this.get('/LeftTree.model').el.get_path(iter).to_string();\n        \n        var data = JSON.parse(value.value);\n        this.get('/MidPropTree').activeElement =  data;\n        this.get('/MidPropTree').hideWin();\n        this.get('/LeftPanel.model').load( data);\n        \n        console.log(value.value);\n       // _g.button.set_label(''+value.get_string());\n\n        var pm =this.get('/RightPalete.model');\n        pm.load(  this.get('/LeftTree').getPaleteProvider().gatherList(\n             this.get('/LeftTree.model').listAllTypes()));\n       \n        \n           if (render && render.redraw) {\n            render.redraw();\n        }\n           \n            //Seed.print( value.get_string());\n            return true;\n                \n}"
+                                                                            },
+                                                                            "id": "view",
+                                                                            "pack": "add",
+                                                                            "tooltip_column": 1,
+                                                                            "xtype": "TreeView",
+                                                                            "|enable_tree_lines": true,
+                                                                            "|headers_visible": false,
+                                                                            "|highlight": "function(treepath_ar) {\n\n        // highlighting for drag/drop\n        if (treepath_ar.length && treepath_ar[0].length ) {\n            this.el.set_drag_dest_row( \n                    new  Gtk.TreePath.from_string( treepath_ar[0] ),  treepath_ar[1]);\n            } else {\n                this.el.set_drag_dest_row(null, Gtk.TreeViewDropPosition.INTO_OR_AFTER);\n            }\n             \n        }",
+                                                                            "|init": "function() {\n    \tXObject.prototype.init.call(this);\n\tvar description = new Pango.FontDescription.c_new();\n\tdescription.set_size(8000);\n\tthis.el.modify_font(description);\n\n\tthis.selection = this.el.get_selection();\n\tthis.selection.set_mode( Gtk.SelectionMode.SINGLE);\n\tvar _this = this;\n\n\t// is this really needed??\n\tthis.selection.signal['changed'].connect(function() {\n\t\t_this.get('/LeftTree.view').listeners.cursor_changed.apply(\n\t\t    _this.get('/LeftTree.view'), [ _this.get('/LeftTree.view'), '']\n\t\t);\n\t});\n\n\tGtk.drag_source_set (\n\t\tthis.el,            /* widget will be drag-able */\n\t\tGdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */\n\t\tnull,            /* lists of target to support */\n\t\t0,              /* size of list */\n\t\tGdk.DragAction.COPY   | Gdk.DragAction.MOVE           /* what to do with data after dropped */\n\t);\n\n\tGtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);\n\n\tGtk.drag_source_add_text_targets(this.el); \n\tGtk.drag_dest_set\n\t(\n\t    this.el,              /* widget that will accept a drop */\n\t    Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,\n\t    null,            /* lists of target to support */\n\t    0,              /* size of list */\n\t    Gdk.DragAction.COPY   | Gdk.DragAction.MOVE       /* what to do with data after dropped */\n\t);\n\n\tGtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);\n\tGtk.drag_dest_add_text_targets(this.el);\n}\n",
+                                                                            "|selectNode": "function(treepath_str) {\n    //this.selection.select_path(new  Gtk.TreePath.from_string( treepath_str));\n var tp = new Gtk.TreePath.from_string(treepath_str);\n          this.el.set_cursor(tp, null, false);  \n      this.el.scroll_to_cell(tp, null, false, 0,0);\n}\n",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "activePath": false,
+                                                                                    "currentTree": false,
+                                                                                    "id": "model",
+                                                                                    "pack": "set_model",
+                                                                                    "xtype": "TreeStore",
+                                                                                    "|changed": "function(n, refresh) {\n    //     print(\"MODEL CHANGED CALLED\" + this.activePath);\n         if (this.activePath) {\n            var iter = new Gtk.TreeIter();\n            this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath))\n            this.el.set_value(iter, 0, [GObject.TYPE_STRING, this.nodeTitle(n)]);\n            this.el.set_value(iter, 1, [GObject.TYPE_STRING, this.nodeTitle(n)]);\n            \n            this.el.set_value(iter, 2, [GObject.TYPE_STRING, this.nodeToJSON(n)]);\n        }\n            //this.currentTree = this.toJS(false, true)[0];\n        var d = new Date();\n        this.file.items = this.toJS(false, false);\n        print (\"TO JS in \" + ((new Date()) - d) + \"ms\");\n      //  print(\"AFTER CHANGED\");\n        //console.dump(this.file.items);\n        this.file.save();\n        this.currentTree = this.file.items[0];\n        //console.log(this.file.toSource());\n        \n        if (refresh) {\n            print(\"REDNER BROWSER?!\");\n            this.get('/LeftTree').renderView();\n\n            var pm = this.get('/RightPalete.model');\n            if (!this.get('/RightPalete').provider) {\n                pm.load([]);\n                return;\n            }\n            \n            \n            pm.load( this.get('/RightPalete').provider.gatherList(this.listAllTypes()));\n            //imports['Builder/RightBrowser.js'].renderJS(this.toJS());\n        }\n\t          \n}\n",
+                                                                                    "|deleteSelected": "function() {\n    this.get('/LeftTree.view').blockChanges = true;\n    var old_iter = new Gtk.TreeIter();\n    var s = this.get('/LeftTree.view').selection;\n    s.get_selected(this.el, old_iter);\n    var path = this.el.get_path(old_iter).to_string();\n\n    this.activePath= false;      \n    s.unselect_all();\n\n    this.activePath= false;      \n     var iter = new Gtk.TreeIter();\n    this.el.get_iter_from_string(iter, path);\n    this.el.remove(iter);\n    \n    // rebuild treemap. -- depreciated.!!\n    this.map = {};\n    this.treemap = { };\n    //this.toJS(null, true) // does not do anything?\n    this.activePath= false;      \n    this.changed(false,true);\n    this.get('/LeftTree.view').blockChanges = false;\n}\n",
+                                                                                    "|dropNode": "function(target_data, node) {\n         print(\"drop Node\");\n     // console.dump(node);\n  //    console.dump(target_data);\n        var tp = target_data[0].length ? new  Gtk.TreePath.from_string( target_data[0] ) : false;\n        \n        print(\"add \" + tp + \"@\" + target_data[1]  );\n        var parent = tp;\n        var after = false;\n        if (tp && target_data[1]  < 2) { // before or after..\n            var ar = target_data[0].split(':');\n            ar.pop();\n            parent  = new  Gtk.TreePath.from_string( ar.join(':') );\n            after = tp;\n        }\n        var n_iter = new Gtk.TreeIter();\n        var iter_par = new Gtk.TreeIter();\n        var iter_after = after ? new Gtk.TreeIter() : false;\n        \n        \n        \n        if (parent !== false) {\n            this.el.get_iter(iter_par, parent);\n        } else {\n            iter_par = null;\n        }\n        \n        \n        if (tp && after) {\n            print(target_data[1]  > 0 ? 'insert_after' : 'insert_before');\n            this.el.get_iter(iter_after, after);\n            this.el[ target_data[1]  > 0 ? 'insert_after' : 'insert_before'](\n                    n_iter, iter_par, iter_after);\n            \n        } else {\n            this.el.append(n_iter, iter_par);\n            \n        }\n        \n        if (typeof(node) == 'string') {\n            var ar = node.split('.');\n            var xtype = ar.pop();\n            \n            node = {\n                '|xns' : ar.join('.'),\n                'xtype' : xtype\n            };\n            if (target_data.length == 3 && target_data[2].length) {\n                node['*prop'] = target_data[2];\n            }\n            node = this.get('/DialogTemplateSelect').show(node);\n            \n        }\n        // work out what kind of packing to use..\n        if (typeof(node.pack) == 'undefined'  && parent !== false) {\n            var pal = this.get('/LeftTree').getPaleteProvider();\n            if (pal.name == 'Gtk') {\n                var pname = pal.guessName(this.singleNodeToJS(parent.to_string()));\n                var cname = pal.guessName(node);\n                node.pack = pal.getDefaultPack(pname, cname);\n            }\n            \n        }\n        \n        \n        var xitems = [];\n        if (node.items) {\n            xitems = node.items;\n            delete node.items;\n        }\n// load children - if it has any..\n\n        if (xitems) {\n            this.load(xitems, n_iter);\n            this.get('/LeftTree.view').el.expand_row(this.el.get_path(n_iter), true);\n        }\n        if (tp && (xitems || after)) {\n            this.get('/LeftTree.view').el.expand_row(this.el.get_path(iter_par), true);\n        }\n        // wee need to get the empty proptypes from somewhere..\n        \n        //var olditer = this.activeIter;\n        this.activePath = this.el.get_path(n_iter).to_string();\n\n  // changed actually set's the node data..\n        this.changed(node, true);\n        \n        \n        \n        this.get('/LeftTree.view').el.set_cursor(this.el.get_path(n_iter), null, false);\n        \n        //Builder.MidPropTree._model.load(node);\n        //Builder.MidPropTree._win.hideWin();\n        //Builder.LeftPanel._model.load( node);\n        \n            \n}\n",
+                                                                                    "|findDropNode": "function(treepath_str, targets) {\n\n// this is used by the dragdrop code in the roo version AFAIR..\n\n    \t\tvar path = treepath_str.replace(/^builder-/, '');\n            // treemap is depreciated... - should really check if model has any entries..\n\n            if (!this.el.iter_n_children(null)) {\n                print(\"NO KEYS\");\n                return [ '',  Gtk.TreeViewDropPosition.INTO_OR_AFTER];\n            }\n            print(\"FIND treepath: \" + path);\n            //console.dump(this.treemap);\n            \n            if (!treepath_str.match(/^builder-/)) {\n                return []; // nothing!\n            }\n            if (targets === true) {\n                return [ path ];\n            }\n            return this.findDropNodeByPath(path,targets) \n}\n",
+                                                                                    "|findDropNodeByPath": "function(treepath_str, targets, pref) {\n    var path = treepath_str + ''; // dupe it..\n    pref = typeof(pref) == 'undefined' ?  Gtk.TreeViewDropPosition.INTO_OR_AFTER : pref;\n    var last = false;\n    //console.dump(this.treemap);\n    while (path.length) {\n        print(\"LOOKING FOR PATH: \" + path);\n        var node_data = this.singleNodeToJS(path);\n        if (node_data === false) {\n            print(\"node not found\");\n            return [];\n        }\n        \n        var xname = this.get('/LeftTree.model').file.guessName(node_data);\n        var match = false;\n        var prop = '';\n        targets.forEach(function(tg) {\n            if (match) {\n                return;;\n            }\n            if ((tg == xname)  ) {\n                match = tg;\n            }\n            if (tg.indexOf(xname +':') === 0) {\n                match = tg;\n                prop = tg.split(':').pop();\n            }\n        });\n        \n        if (match) {\n            if (last) { // pref is after/before..\n                // then it's after last\n                if (pref > 1) {\n                    return []; // do not allow..\n                }\n                return [ last, pref , prop];\n                \n            }\n            return [ path , Gtk.TreeViewDropPosition.INTO_OR_AFTER , prop];\n        }\n        var par = path.split(':');\n        last = path;\n        par.pop();\n        path = par.join(':');\n    }\n    \n    return [];\n            \n}\n",
+                                                                                    "|getIterValue": " function (iter, col) {\n    var gval = new GObject.Value('');\n    this.el.get_value(iter, col ,gval);\n    return  gval.value;\n    \n    \n}",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n this.el.set_column_types ( 3, [\n            GObject.TYPE_STRING, // title \n            GObject.TYPE_STRING, // tip\n            GObject.TYPE_STRING // source..\n            ] );\n}\n",
+                                                                                    "|listAllTypes": "function() {\n    var s = this.get('/LeftTree.view').selection;\n    print (\"LIST ALL TYPES: \" + s.count_selected_rows() );\n    \n    if (s.count_selected_rows() > 0) {\n        var iter = new Gtk.TreeIter();    \n        s.get_selected(this.el, iter);\n\n        // set some properties of the tree for use by the dropped element.\n        var value = new GObject.Value('');\n        this.el.get_value(iter, 2, value);\n        var data = JSON.parse(value.value);\n        \n        \n        var xname = this.get('/LeftTree.model').file.guessName(data);\n        console.log('selected:' + xname);\n        if (xname.length) {\n            return [ xname ];\n        }\n        return []; // could not find it..\n    }\n    \n    var ret = [ ];\n    \n   var _this = this;\n    function addall(li)\n    {\n        li.forEach(function(el) {\n            // this is specific to roo!!!?\n            if (!el) { // skip empty?\n                return;\n            }\n            var fullpath =  _this.file.guessName(el);\n            if (fullpath.length && ret.indexOf(fullpath) < 0) {\n                ret.push(fullpath);\n            }\n            \n            \n            if (el.items && el.items.length) {\n                addall(el.items);\n            }\n            \n        });\n        \n        \n    }\n    \n    addall([this.currentTree]);\n    \n    // only if we have nothing, should we add '*top'\n    if (!ret.length) {\n        ret = [ '*top' ];\n    }\n    //console.log('all types in tree');\n    //console.dump(ret);\n    \n    return ret;\n                            \n}\n",
+                                                                                    "|load": "function(tr,iter)\n        {\n            var citer = new Gtk.TreeIter();\n            //this.insert(citer,iter,0);\n            for(var i =0 ; i < tr.length; i++) {\n                if (iter) {\n                    this.el.insert(citer,iter,-1);\n                } else {\n                    this.el.append(citer);\n                }\n                \n                this.el.set_value(citer, 0, [GObject.TYPE_STRING, this.nodeTitle(tr[i]) ]);\n                this.el.set_value(citer, 1, [GObject.TYPE_STRING, this.nodeTip(tr[i]) ]);\n                this.el.set_value(citer, 2, [GObject.TYPE_STRING, this.nodeToJSON(tr[i])]);\n                if (tr[i].items && tr[i].items.length) {\n                    this.load(tr[i].items, citer);\n                }\n            }     \n        }",
+                                                                                    "|loadFile": "function(f) {\n    //console.dump(f);\n            this.el.clear();\n            this.file = f;\n            \n            if (!f) {\n                console.log('missing file');\n                return;\n            }\n            \n            // load the file if not loaded..\n            if (f.items === false) {\n                var _this = this;\n                f.loadItems(function() {\n                    _this.loadFile(f);\n                });\n                return;\n                \n            }\n            this.get('/Window').setTitle(f.project.getName() + ' - ' + f.name);\n            \n            if (f.items.length && typeof(f.items[0]) == 'string') {\n            \n                //this.get('/RightEditor').el.show();\n                //this.get('/RightEditor.view').load( f.items[0]);\n                return;\n            }\n            print(\"LOAD\");\n            print(JSON.stringify(f.items, null,4));\n            //console.dump(f.items);\n            this.load(f.items);\n            this.get('/LeftTree.view').el.expand_all();\n\n            if (!f.items.length) {\n                // single item..\n                \n                this.get('/Window.leftvpaned').el.set_position(80);\n                // select first...\n                this.get('/LeftTree.view').el.set_cursor( \n                    new  Gtk.TreePath.from_string('0'), null, false);\n                \n                \n            } else {\n                  this.get('/Window.leftvpaned').el.set_position(200);\n            }\n            \n            \n            //print(\"hide right editior\");\n            //this.get('/RightEditor').el.hide();\n            this.get('/Editor').el.hide();\n            //print(\"set current tree\");\n            this.currentTree = this.toJS(false, false)[0];\n            //console.dump(this.currentTree);\n            this.currentTree = this.currentTree || { items: [] };\n            this.get('/LeftTree').renderView();\n            //console.dump(this.map);\n            //var RightPalete     = imports.Builder.RightPalete.RightPalete;\n            var pm = this.get('/RightPalete.model');\n            // set up provider..\n            \n            this.get('/RightPalete').provider = this.get('/LeftTree').getPaleteProvider();\n            \n            if (!this.get('/RightPalete').provider) {\n                print (\"********* PALETE PROVIDER MISSING?!!\");\n            }\n            this.get('/LeftTree').renderView();\n            \n            pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(this.listAllTypes()));\n            \n            \n                    \n            this.get('/Window.view-notebook').el.set_current_page(\n                this.get('/LeftTree.model').file.getType()== 'Roo' ? 0 : -1);\n                    \n}\n",
+                                                                                    "|moveNode": "function(target_data, action) {\n     //print(\"MOVE NODE\");\n           // console.dump(target_data);\n            var old_iter = new Gtk.TreeIter();\n            var s = this.get('/LeftTree.view').selection;\n            s.get_selected(this.el, old_iter);\n            var node = this.nodeToJS(old_iter,false);\n            //console.dump(node);\n            \n            \n            // needs to drop first, otherwise the target_data \n            // treepath will be invalid.\n            \n            this.dropNode(target_data, node);\n\t  if (action & Gdk.DragAction.MOVE) {\n                      //          print(\"REMOVING OLD NODE\");\n                                this.el.remove(old_iter);\n                                \n            }\n            \n            this.activePath= false;\n            this.changed(false,true);\n}\n",
+                                                                                    "|nodeTip": "function(c) {\n    var ret = this.nodeTitle(c,true);\n    var funcs = '';\n\n    \n    for( var i in c) {\n\n        if (!i.length || i[0] != '|') {\n            continue;\n        }\n        if (i == '|init') { \n            continue;\n        }\n        if (typeof(c[i]) != 'string') {\n           continue;\n        }\n        //print(\"prop : \" + i + ':' + c[i]);\n        if (!c[i].match(new RegExp('function'))) {\n            continue;\n        }\n        funcs += \"\\n<b>\" + i.substring(1) + '</b> : ' + c[i].split(/\\n/).shift();\n            \n    }\n    if (funcs.length) {\n        ret+=\"\\n\\nMethods:\" + funcs;\n    }\n    return ret;\n    \n}\n",
+                                                                                    "|nodeTitle": "function(c, renderfull) {\n      var txt = [];\n    c = c || {};\n    var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;\n    if (sr) txt.push('<s>');\n    if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }\n    \n    if (renderfull && c['|xns']) {\n        txt.push(c['|xns']);\n    }\n    \n    if (c.xtype)      { txt.push(c.xtype); }\n    if (c.id)      { txt.push('<b>[id=' + c.id + ']</b>'); }\n    if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }\n    if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }\n    \n    \n    if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }\n    if (c.title)      { txt.push('<b>' + c.title + '</b>'); }\n    if (c.label)      { txt.push('<b>' + c.label+ '</b>'); }\n    if (c.header)    { txt.push('<b>' + c.header + '</b>'); }\n    if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }\n    if (c.text)       { txt.push('<b>' + c.text + '</b>'); }\n    if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }\n    if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }\n    if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }\n    \n    // for flat classes...\n    if (typeof(c['*class']) != 'undefined')  { txt.push('<b>' +  c['*class']+  '</b>'); }\n    if (typeof(c['*extends']) != 'undefined')  { txt.push(': <i>' +  c['*extends']+  '</i>'); }\n    \n    \n    if (sr) txt.push('</s>');\n    return (txt.length == 0 ? \"Element\" : txt.join(\" \"));\n}\n",
+                                                                                    "|nodeToJS": "function (treepath, with_id) \n{\n    \n    var iter = treepath;  // API used to be iter here..\n    if (typeof(iter) == 'string') {\n        iter = new Gtk.TreeIter(); \n        if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {\n            return false;\n        }\n    } \n    var par = new Gtk.TreeIter(); \n    var iv = this.getIterValue(iter, 2);\n   // print(\"IV\" + iv);\n    var k = JSON.parse(iv);\n    if (k.json && !this.el.iter_parent( par, iter  )) {\n        delete k.json;\n    }\n    \n    if (with_id) {\n        var treepath_str = this.el.get_path(iter).to_string();\n        // not sure how we can handle mixed id stuff..\n        if (typeof(k.id) == 'undefined')  {\n            k.id =  'builder-'+ treepath_str ;\n        }\n        \n        // needed??\n        this.treemap[  treepath_str ] = k;\n        k.xtreepath = treepath_str ;\n        \n    }\n    if (this.el.iter_has_child(iter)) {\n        citer = new Gtk.TreeIter();\n        this.el.iter_children(citer, iter);\n        k.items = this.toJS(citer,with_id);\n    }\n    return k;\n}\n",
+                                                                                    "|nodeToJSON": "function(c) {\n    var o  = {}\n    for (var i in c) {\n        if (i == 'items') {\n             continue;\n        }\n        o[i] = c[i];\n    }\n    return JSON.stringify(o);\n}\n",
+                                                                                    "|singleNodeToJS": "function (treepath) \n        {\n            var iter = new Gtk.TreeIter(); \n            if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {\n                return false;\n            }\n            \n            var iv = this.getIterValue(iter, 2);\n           \n            return JSON.parse(iv);\n            \n        }",
+                                                                                    "|toJS": "function(treepath, with_id)\n{\n    //Seed.print(\"WITHID: \"+ with_id);\n    var iter = treepath;  // API used to be iter here..\n    if (typeof(iter) == 'string') {\n        iter = new Gtk.TreeIter(); \n        if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {\n            return false;\n        }\n    } \n    var first = false;\n    if (!iter) {\n        \n        this.treemap = { }; \n        \n        iter = new Gtk.TreeIter();\n        if (!this.el.get_iter_first(iter)) {\n            return [];\n        }\n        first = true;\n    } \n    \n    var ar = [];\n       \n    while (true) {\n        \n        var k = this.nodeToJS(iter, with_id); \n        ar.push(k);\n        \n        \n        if (!this.el.iter_next(iter)) {\n            break;\n        }\n    }\n    \n    if (treepath === false) {\n        //dupe!!!\n        return JSON.parse(JSON.stringify(ar));\n    }\n    \n    return ar;\n    // convert the list into a json string..\n\n    \n}",
+                                                                                    "|xns": "Gtk"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "TreeViewColumn",
+                                                                                    "pack": "append_column",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.add_attribute(this.items[0].el , 'markup', 0 );\n}\n",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "CellRendererText",
+                                                                                            "pack": "pack_start"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "Menu",
+                                                                            "pack": false,
+                                                                            "id": "LeftTreeMenu",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "add",
+                                                                                    "label": "Delete Element",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n     this.get('/LeftTree.model').deleteSelected();\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n     var tree = this.get('/LeftTree');\n      var model = this.get('/LeftTree.model');\n     var el = tree.getActivePath();\n     print(el);\n     var js = model.toJS(el, false);\n    // print(JSON.stringify(js[0], null,4));\n     this.get('/DialogSaveTemplate').show(JSON.stringify(js[0], null,4));\n     \n    \n}"
+                                                                                    },
+                                                                                    "label": "Save as Template",
+                                                                                    "pack": "add",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "|xns": "Gtk"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "VBox",
+                                                                    "pack": "add",
+                                                                    "id": "LeftProjectTree",
+                                                                    "|showNoProjectSelected": "function() {\n   this.get('/StandardErrorDialog').show(\"Select a Project first.\"); \n}\n",
+                                                                    "|getActiveProject": "function() {\n     return this.project;\n}\n",
+                                                                    "listeners": {
+                                                                        "leave_notify_event": "function (self, event) {\n    return false;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "pack_start,false,false",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "ComboBox",
+                                                                                    "id": "combo",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.add_attribute(this.get('render').el , 'markup', 1 );  \n}\n",
+                                                                                    "|getValue": "function() {\n    var ix = this.el.get_active();\n    if (ix < 0 ) {\n        return false;\n    }\n    var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;\n    if (typeof(data[ix]) == 'undefined') {\n \treturn false; \n    }\n    return data[ix].fn;\n}",
+                                                                                    "|setValue": "function(fn)\n{\n    var el = this.el;\n    el.set_active(-1);\n    var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;\n    data.forEach(function(n, ix) {\n        if (fn == n.fn) {\n            el.set_active(ix);\n            return false;\n        }\n    });\n}\n",
+                                                                                    "listeners": {
+                                                                                        "changed": "function (self) {\n\tvar fn = this.getValue();\n\tvar pm  = imports.Builder.Provider.ProjectManager.ProjectManager;\n\tthis.get('/LeftProjectTree.model').loadProject(pm.getByFn(fn))\n}"
+                                                                                    },
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "CellRendererText",
+                                                                                            "pack": "pack_start,true",
+                                                                                            "id": "render"
+                                                                                        },
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "ListStore",
+                                                                                            "pack": "set_model",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n  this.el.set_column_types ( 2, [\n        GObject.TYPE_STRING,  // real key\n        GObject.TYPE_STRING // real type\n        \n        \n    ] );\n   var pm = imports.Builder.Provider.ProjectManager.ProjectManager;\n   var _this = this;\n   pm.on('changed', function() {\n       print(\"caught changed hook on project manager - reloading data\");\n\t_this.loadData(pm.projects);\n\n   });\n}\n",
+                                                                                            "|loadData": "function(data) {\n     var ov = this.get('/LeftProjectTree.combo').getValue();\n    this.el.clear();\n    var iter = new Gtk.TreeIter();\n    var el = this.el;\n    data.forEach(function(p) {\n        \n        el.append(iter);\n        \n         \n        el.set_value(iter, 0, p.fn);\n        el.set_value(iter, 1, p.name);\n        \n    });\n    \n    this.get('/LeftProjectTree.combo').setValue(ov);\n}\n",
+                                                                                            "id": "combomodel"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "ScrolledWindow",
+                                                                            "pack": "add",
+                                                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_policy  (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC );\n}\n",
+                                                                            "items": [
+                                                                                {
+                                                                                    "listeners": {
+                                                                                        "cursor_changed": "function (self) {\n \tvar iter = new Gtk.TreeIter();\n                                \n        if (this.selection.count_selected_rows() < 1) {\n            //XN.get('Builder.LeftTree.model').\n            this.get('/LeftTree.model').load( false);\n            \n            return;\n        }\n        var model = this.get('/LeftProjectTree.model');\n        //console.log('changed');\n        var s = this.selection;\n        s.get_selected(model, iter);\n        value = new GObject.Value('');\n        model.el.get_value(iter, 2, value);\n        \n        console.log(value.value);// id..\n        \n        var file = this.get('/LeftProjectTree').project.getById(value.value);\n        \n        file.items = false;\n        console.log(file);\n        \n\n\n        var nb = this.get('/LeftTopPanel.expander');\n        nb.el.expanded = false;\n        nb.onCollapse();\n        //nb.listeners.activate.call(nb);\n        //_expander.el.set_expanded(false);\n\n        var ltm = this.get('/LeftTree.model');\n        ltm.loadFile(file);\n        \n        return true;\n}"
+                                                                                    },
+                                                                                    "id": "view",
+                                                                                    "tooltip_column": 1,
+                                                                                    "xtype": "TreeView",
+                                                                                    "|enable_tree_lines": true,
+                                                                                    "|headers_visible": false,
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\nvar description = new Pango.FontDescription.c_new();\n                            description.set_size(8000);\n                            this.el.modify_font(description);\n                            \n                            this.selection = this.el.get_selection();\n                            this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n}\n",
+                                                                                    "|xns": "Gtk",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "TreeStore",
+                                                                                            "pack": "set_model",
+                                                                                            "id": "model",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n  this.el.set_column_types ( 3, [\n                    GObject.TYPE_STRING, // title \n                    GObject.TYPE_STRING, // tip\n                    GObject.TYPE_STRING // id..\n                    ] );\n   \n}\n",
+                                                                                            "|loadProject": "function(pr) {\nprint(\"LOAD PROJECT\");\n           this.el.clear();\n            if (!pr) {\n                return;\n            }\n            \n            this.get('/LeftProjectTree').project = pr;\n            this.load(pr.toTree());\n            this.get('/LeftProjectTree.view').el.expand_all();\n}\n",
+                                                                                            "|load": "function(tr,iter) {\n  //  console.dump(tr);\n            console.log('Project tree load: ' + tr.length);\n            var citer = new Gtk.TreeIter();\n            //this.insert(citer,iter,0);\n            \n            var _this = this;\n            tr.forEach(function (r) {\n                if (!iter) {\n                    _this.el.append(citer);   \n                } else {\n                    _this.el.insert(citer,iter,-1);\n                }\n                _this.el.set_value(citer, 0,  '' + r.getTitle() ); // title \n                _this.el.set_value(citer, 1, '' + r.getTitleTip()); // tip\n                _this.el.set_value(citer, 2, '' + r.id ); //id\n                if (r.cn && r.cn.length) {\n                    _this.load(r.cn, citer);\n                }\n                \n            });\n}\n",
+                                                                                            "|getValue": "function(iter, col) {\n    var gval = new GObject.Value('');\n    this.el.get_value(iter, col ,gval);\n    return  '' + gval.value;\n}\n"
+                                                                                        },
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "TreeViewColumn",
+                                                                                            "pack": "append_column",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.add_attribute(this.items[0].el , 'markup', 0 );\n}\n",
+                                                                                            "items": [
+                                                                                                {
+                                                                                                    "|xns": "Gtk",
+                                                                                                    "xtype": "CellRendererText",
+                                                                                                    "pack": "pack_start"
+                                                                                                }
+                                                                                            ]
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "listeners": {},
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "HBox",
+                                                            "pack": "pack_start,false,true,0",
+                                                            "id": "LeftProps",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Button",
+                                                                    "pack": "add",
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, event) {\n    this.get('/MidPropTree.model').showData('props');\n    return false;\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "add",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Image",
+                                                                                    "pack": "add",
+                                                                                    "|stock": "Gtk.STOCK_ADD",
+                                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Label",
+                                                                                    "pack": "add",
+                                                                                    "label": "Property"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, event) {\n    \n \tif (!this.get('/Editor').save()) {\n \t    // popup!! - click handled.. \n \t    return true;\n        }\n        this.get('/MidPropTree.model').showData('events');\n    return false;\n}"
+                                                                    },
+                                                                    "pack": "add",
+                                                                    "xtype": "Button",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "add",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Image",
+                                                                                    "pack": "add",
+                                                                                    "|stock": "Gtk.STOCK_ADD",
+                                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Label",
+                                                                                    "pack": "add",
+                                                                                    "label": "Handler"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, ev) {\n\n \tif (!this.get('/Editor').save()) {\n \t    // popup!! - click handled.. \n \t    return true;\n        }\n        \n\tvar p = this.get('/AddPropertyPopup');\n\tif (!p.el) {\n\t\tp.init();\n\t}\n \tp.el.set_screen(Gdk.Screen.get_default());\n        p.el.show_all();\n         p.el.popup(null, null, null, null, 3, ev.button.time);\n    return true;\n}"
+                                                                    },
+                                                                    "pack": "add",
+                                                                    "xtype": "Button",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "HBox",
+                                                                            "pack": "add",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Image",
+                                                                                    "pack": "add",
+                                                                                    "|stock": "Gtk.STOCK_ADD",
+                                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "Label",
+                                                                                    "pack": "add",
+                                                                                    "label": "Other"
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "Menu",
+                                                                            "pack": false,
+                                                                            "id": "AddPropertyPopup",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Using this.get('*someid') will find any id in an application.",
+                                                                                    "label": "ID",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n        key : 'id', \n        type : 'string',\n        val : '',\n        //skel  : skel,\n        etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add what type of packing is to be used",
+                                                                                    "label": "PACK",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n    \t key : 'pack', \n       \t type : 'string',\n       \t val : 'add',\n          etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Override the init method",
+                                                                                    "label": "INIT",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n       key : '|init', \n        type : 'function',\n        val  : \"function() {\\n    XObject.prototype.init.call(this);\\n}\\n\",\n        etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "SeparatorMenuItem",
+                                                                                    "pack": "add"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user defined string property",
+                                                                                    "label": "String",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t\t  key : '', \n                type : 'string',\n                val  : \"\",\n                etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user defined number property",
+                                                                                    "label": "Number",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t\t  key : '', \n                type : 'number',\n                val  : 0,\n                etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user defined boolean property",
+                                                                                    "label": "Boolean",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t\t  key : '', \n                type : 'boolean',\n                val  : false,\n                etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "SeparatorMenuItem",
+                                                                                    "pack": "add"
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "MenuItem",
+                                                                                    "pack": "append",
+                                                                                    "tooltip_markup": "Add a user function boolean property",
+                                                                                    "label": "Function",
+                                                                                    "listeners": {
+                                                                                        "activate": "function (self) {\n\n    this.get('/LeftPanel.model').add( {\n  \t    key : '|', \n                        type : 'function',\n                        val  : \"function() {\\n    \\n}\\n\",\n                        etype : 'props'\n    });\n}"
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "editing": false,
+                                                            "id": "LeftPanel",
+                                                            "pack": "add",
+                                                            "xtype": "ScrolledWindow",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n}\n",
+                                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                                            "|xns": "Gtk",
+                                                            "items": [
+                                                                {
+                                                                    "listeners": {
+                                                                        "button_press_event": "function (self, ev) {\n\n    \n    if (!this.get('/Editor').save()) {\n        // popup!! - click handled.. \n        return true;\n    }\n    var res = { }; \n    \n    if (!this.el.get_path_at_pos(ev.button.x,ev.button.y, res)) {\n        return false; //not on a element.\n    }\n    \n     // right click.\n     if (ev.type == Gdk.EventType.BUTTON_PRESS  && ev.button.button == 3) {    \n        // show popup!.   \n        if (res.column.title == 'value' && this.get('/LeftPanel').editing) {\n            return false;\n        }\n        //if (! this.get('/LeftPanelPopup')LeftPanelPopup.el) LeftPanelPopup.init();\n        var p = this.get('/LeftPanelPopup');\n        if (!p.el) {\n            p.init();\n        }\n\n        p.el.set_screen(Gdk.Screen.get_default());\n        p.el.show_all();\n        p.el.popup(null, null, null, null, 3, ev.button.time);\n        //Seed.print(\"click:\" + res.column.title);\n        \n        \n        return false;\n    }\n    \n     \n    if (res.column.title != 'value') {\n          //  XObject.error(\"column is not value?\");\n        return false; // ignore.. - key click.. ??? should we do this??\n    }\n    \n    // currently editing???\n//    if (  this.activePath) {\n        \n     //   this.activePath = false;\n       // stop editing!!!!\n        if (this.get('/Editor').dirty) {\n            //if (!this.get('/Editor.buffer').checkSyntax()) {\n            //   this.get('/StandardErrorDialog').show(\"Fix errors in code and save..\"); \n            //   return true;\n            //    // error Dialog\n            //}\n            if (!this.get('/Editor.view').save()) {\n                return true;\n            }\n        }   \n        this.get('/LeftPanel').editableColumn.items[0].el.stop_editing();\n        this.get('/LeftPanel').editing = false;\n    \n    //    XObject.error(\"Currently editing?\");\n     //   return false;\n   // }\n    \n    var renderer = this.get('/LeftPanel').editableColumn.items[0].el; // set has_entry..\n    \n    var type = this.get('/LeftPanel.model').getType(res.path.to_string());\n        \n    // get options for this type -- this is to support option lists etc..\n    var provider = this.get('/LeftTree').getPaleteProvider();\n    var opts = provider.findOptions(type);\n    \n    if (opts === false) {\n        // it's text etnry\n         this.get('/LeftPanel').editableColumn.setOptions([]);\n        renderer.has_entry = true;\n    } else {\n         this.get('/LeftPanel').editableColumn.setOptions(opts);\n        renderer.has_entry = false;\n    }\n    this.get('/LeftPanel.model').startEditing(res.path.to_string(), 1);\n        \n   //Seed.print(\"click\" + ev.type);\n    //console.dump(res);\n    return false;\n\n              \n   \n}"
+                                                                    },
+                                                                    "id": "view",
+                                                                    "tooltip_column": 5,
+                                                                    "xtype": "TreeView",
+                                                                    "|enable_tree_lines": true,
+                                                                    "|headers_visible": false,
+                                                                    "|init": "function() {\n     XObject.prototype.init.call(this); \n                       \n                    this.selection = this.el.get_selection();\n                    this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n                 \n                    \n                    var description = new Pango.FontDescription.c_new();\n                    description.set_size(8000);\n                    this.el.modify_font(description);\n}\n",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "activePath": false,
+                                                                            "id": "model",
+                                                                            "pack": "set_model",
+                                                                            "xtype": "TreeStore",
+                                                                            "|add": "function(info) {\n      // info includes key, val, skel, etype..\n              console.dump(info);\n            type = info.type.toLowerCase();\n            var data = this.toJS();\n            \n            if (info.etype == 'events') {\n                data.listeners = data.listeners || { };\n                if (typeof(data.listeners[info.key]) != 'undefined') {\n                    return; //already set!\n                }\n            } else {\n                if (typeof(data[info.key]) != 'undefined') {\n                    return;\n                }\n            }\n            \n            if (typeof(info.val) == 'undefined') {\n                    \n                info.val = '';\n                if (info.type.toLowerCase() == 'boolean') {\n                    info.val = true;\n                }\n                if (type == 'number') {\n                    info.val = 0;\n                }\n                // utf8 == string..\n                \n                \n            }\n            var k = info.key;\n            if (info.etype == 'events') {\n             \n                data.listeners[info.key] = info.val;\n                k = '!' + info.key;\n            } else {\n                data[info.key] = info.val;\n            }\n            \n            \n            var map = this.load(data);\n            \n            // flag it as changed to the interface..\n\n            this.get('/LeftTree.model').changed(data, true); \n            \n            \n            this.startEditing(map[k]);\n             \n            /*\n            LeftPanel.get('view').el.row_activated(\n                new Gtk.TreePath.from_string(map[k]), \n                LeftPanel.editableColumn.el\n            );\n            */\n}\n",
+                                                                            "|changed": "function(str, doRefresh) {\n    if (!this.activePath) {\n        return;\n    }\n    var iter = new Gtk.TreeIter();\n    this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath));\n    \n    this.el.set_value(iter, 1, '' +str);\n    this.el.set_value(iter, 3, '' + this.toShort(str));\n    var type = this.getIterValue(iter, 4);\n\n    this.el.set_value(iter, 5, type + ' : ' + str);\n    // update the tree...  \n\n    this.get('/LeftTree.model').changed(this.toJS(), doRefresh); \n}\n",
+                                                                            "|deleteSelected": "function() {\n     var data = this.toJS();\n    var iter = new Gtk.TreeIter();\n    var s = this.get('/LeftPanel.view').selection;\n    s.get_selected(this.el, iter);\n         \n       \n    var gval = new GObject.Value('');\n   this.get('/LeftPanel.model').el.get_value(iter, 0 ,gval);\n    \n    var val = gval.value;\n    if (val[0] == '!') {\n        // listener..\n        if (!data.listeners || typeof(data.listeners[  val.substring(1)]) == 'undefined') {\n            return;\n        }\n        delete data.listeners[  val.substring(1)];\n        if (!XObject.keys(data.listeners).length) {\n            delete data.listeners;\n        }\n        \n    } else {\n        if (typeof(data[val]) == 'undefined') {\n            return;\n        }\n        delete data[val];\n    }\n    \n    \n    this.load(data);\n    this.get('/LeftTree.model').changed(data, true);\n    \n}\n",
+                                                                            "|getIterValue": "function(iter, col) {\n     var gval = new GObject.Value('');\n    this.get('/LeftPanel.model').el.get_value(iter, col ,gval);\n    return '' + gval.value;\n}\n",
+                                                                            "|getType": "function(treepath) {\n     return this.getValue(treepath, 4);\n}\n",
+                                                                            "|getValue": "function(treepath_str, col) \n{\n   // get's the  value in a row.. - keys - returns string, values - formats it..\n\n    var iter = new Gtk.TreeIter();\n    this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath_str));\n    \n    var gval = new GObject.Value('');\n    this.get('/LeftPanel.model').el.get_value(iter, col ,gval);\n    var val = '' + gval.value;\n   \n    if (col != 1) {\n        return val;\n    }\n    var type = this.getType(this.el.get_path(iter).to_string());\n    //print(\"TYPE: \" +type + \" -  val:\" + val);\n    switch(type.toLowerCase()) {\n        case 'number':\n        case 'uint':\n        case 'int':\n            return parseFloat(val); // Nan ?? invalid!!?        \n        case 'float':\n        case 'gfloat':\n            return 1.0 * parseFloat(val); // Nan ?? invalid!!?\n        case 'boolean':\n            return val == 'true' ? true : false;\n        default: \n            var nv = parseFloat(val);\n            if (!isNaN(nv) && (val == ''+nv)) {\n                return nv;\n            }\n            return val;\n    }\n                            \n}\n",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\nthis.el.set_column_types ( 6, [\n                                GObject.TYPE_STRING,  // 0 real key\n                                GObject.TYPE_STRING, // 1 real value \n                                 GObject.TYPE_STRING,  // 2 visable key\n                                 GObject.TYPE_STRING, // 3 visable value\n                                 GObject.TYPE_STRING, // 4 need to store type of!!!\n                                  GObject.TYPE_STRING // 5 tooltip\n                              \n                            ]);\n}\n",
+                                                                            "|load": "function(ar) {\n// might casue problesm..\n    // this.get('/Editor.RightEditor').save();\n\n       this.get('/Editor').el.hide();\n     this.get('/Editor').activePath = false;\n\n\n  this.el.clear();\n              \n    //this.get('/RightEditor').el.hide();\n    if (ar === false) {\n        return ;\n    }\n    var ret = {}; \n    \n\n    var provider = this.get('/LeftTree').getPaleteProvider();\n     var iter = new Gtk.TreeIter();\n     \n    // sort!!!?\n    var keys  = XObject.keys(ar);\n    keys.sort();\n    ar.listeners = ar.listeners || {};\n    \n    for (var i in ar.listeners ) {\n        this.el.append(iter);\n        var p = this.el.get_path(iter).to_string();\n        ret['!' + i] = p;\n        \n        this.el.set_value(iter, 0, '!'+  i  );\n        this.el.set_value(iter, 1, '' + ar.listeners[i]);\n        this.el.set_value(iter, 2, '<b>'+ i + '</b>');\n        \n        this.el.set_value(iter, 3, '' + this.toShort(ar.listeners[i]));\n        this.el.set_value(iter, 4, 'function');\n        this.el.set_value(iter, 5, i + ' : ' + ar.listeners[i]);\n    }\n    \n    \n   \n    var _this = this;\n    keys.forEach(function(i) {\n        if (typeof(ar[i]) == 'object') {\n            return;\n        }\n        \n        var type = provider.findType(ar, i, ar[i]);\n        \n        _this.el.append(iter);\n        var p = _this.el.get_path(iter).to_string();\n        ret[i] = p;\n        _this.el.set_value(iter, 0, ''+i);\n        _this.el.set_value(iter, 1, '' + ar[i]);  \n        _this.el.set_value(iter, 2, ''+i);\n        _this.el.set_value(iter, 3, ''+ _this.toShort(ar[i]));\n        _this.el.set_value(iter, 4, ''+type);\n        _this.el.set_value(iter, 5, type + ' : ' + ar[i]);\n    })\n    return ret;\n}\n",
+                                                                            "|startEditing": "function(path,col) {\n    \n    // alled by menu 'edit' currently..\n    /**\n    * start editing path (or selected if not set..)\n    * @param {String|false} path  (optional) treepath to edit - selected tree gets\n    *     edited by default.\n    * @param {Number} 0 or 1 (optional)- column to edit. \n    */\n    // fix tp to be the 'treepath' string (eg. 0/1/2...)\n    var tp;\n    if (typeof(path) == 'string') {\n        tp = new Gtk.TreePath.from_string(path);\n    } else {\n        var iter = new Gtk.TreeIter();\n        var s = this.get('/LeftPanel.view').selection;\n        s.get_selected(this.el, iter);\n        tp = this.el.get_path(iter);\n        path = tp.to_string();\n    }\n    \n   \n    // which colum is to be edited..\n    var colObj = false;\n    \n    // not sure what this does..\n    \n    if (typeof(col) == 'undefined') {\n        var k = this.getValue(path, 0);\n        col = 1;\n        colObj = (!k.length || k == '|') ? \n            this.get('/LeftPanel').propertyColumn : this.get('/LeftPanel').editableColumn;\n    } else {\n        colObj = col ? this.get('/LeftPanel').editableColumn : this.get('/LeftPanel').propertyColumn;\n    }\n    \n    // make sure the pulldown is set correctly..\n    // not really needed for second col...\n    var showEditor = false;\n    this.get('/Editor').activePath = false;\n    this.get('/Editor').el.hide();\n     \n    if (col) {\n        var provider = this.get('/LeftTree').getPaleteProvider();\n        var type = this.get('/LeftPanel.model').getType(path);\n        var opts = provider.findOptions(type);\n        var renderer = this.get('/LeftPanel').editableColumn.items[0].el;\n        \n        if (opts === false) {\n            this.get('/LeftPanel').editableColumn.setOptions([]);\n            renderer.has_entry = true; \n        } else {\n            this.get('/LeftPanel').editableColumn.setOptions(opts);\n            renderer.has_entry = false;/// - pulldowns do not have entries\n        }\n        // determine if we should use the Text editor...\n        var keyname = this.getValue(path, 0);\n        var data_value = this.getValue(path, 1);\n    \n        if ((keyname[0] == '|') || \n            (   \n                (typeof(data_value) == 'string' ) && \n                ( data_value.match(/function/g) || data_value.match(/\\n/g)) // || (data_value.length > 20))\n            )) {\n            showEditor = true;\n        }\n        print(\"SHOW EDITOR\" + showEditor ? 'YES' :'no');\n        \n    }\n    var _this = this;    \n    // end editing..\n   // this.get('/BottomPane').el.hide();\n    //this.get('/RightEditor').el.hide();\n     \n    \n    if (showEditor) {\n\n        this.activePath = false;\n        \n        _this.get('/Editor').el.show_all();\n        GLib.timeout_add(0, 1, function() {\n\n            //_this.get('/BottomPane').el.show();\n             //_this.get('/RightEditor').el.show();\n            \n            _this.get('/Editor.RightEditor.view').load( _this.getValue(path, 1) );\n            \n            _this.get('/Editor').activePath = path;\n            _this.activePath = path ;\n          \n            return false;\n        });\n        return;\n    }\n      \n    \n    \n\n    // iter now has row...\n    GLib.timeout_add(0, 100, function() {\n        _this.activePath = path;\n        colObj.items[0].el.editable = true; // esp. need for col 0..\n        _this.get('/LeftPanel.view').el.set_cursor_on_cell(\n            tp,\n            colObj.el,\n            colObj.items[0].el,\n            true\n        );\n    });\n    \n}\n",
+                                                                            "|toJS": "function() {\n     var iter = new Gtk.TreeIter();\n    this.get('/LeftPanel.model').el.get_iter_first(iter);\n    var ar = {};\n       \n    while (true) {\n        \n        var k = this.getValue(this.el.get_path(iter).to_string(), 0);\n       // Seed.print(k);\n        if (k[0] == '!') {\n            ar.listeners = ar.listeners || {};\n            ar.listeners[  k.substring(1)] = this.getValue(this.el.get_path(iter).to_string(), 1);\n            \n        } else {\n            ar[ k ] = this.getValue(this.el.get_path(iter).to_string(), 1);\n        }\n        \n        if (! this.get('/LeftPanel.model').el.iter_next(iter)) {\n            break;\n        }\n    }\n    \n    \n    //print(JSON.stringify(ar));\n    return ar;\n    // convert the l\n}\n",
+                                                                            "|toShort": "function(str) {\n    var a = typeof(str) == 'string' ? str.split(\"\\n\") : [];\n        return a.length > 1 ? a[0] + '....' : '' + str;\n}\n",
+                                                                            "|xns": "Gtk"
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "TreeViewColumn",
+                                                                            "pack": "append_column",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\n    this.el.add_attribute(this.items[0].el , 'markup', 2 );\n    this.get('/LeftPanel').propertyColumn = this;\n}\n",
+                                                                            "title": "key",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "CellRendererText",
+                                                                                    "pack": "pack_start",
+                                                                                    "listeners": {
+                                                                                        "editing_started": "function (self, editable, path) {\n\n        this.get('/LeftPanel.model').activePath  = path;\n\n}",
+                                                                                        "edited": "function (self, object, p0) {\n\tvar model = this.get('/LeftPanel.model');\n        var path = model.activePath;\n        var iter = new Gtk.TreeIter();\n        model.el.get_iter(iter, new Gtk.TreePath.from_string(path));\n        model.el.set_value(iter, 0, p0);\n        model.el.set_value(iter, 2, p0);\n        \n\tmodel.activePath = false;\n\n\tthis.get('/LeftTree.model').changed(model.toJS(), true); \n        this.el.editable = false;\n}"
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "pack": "append_column",
+                                                                            "title": "value",
+                                                                            "xtype": "TreeViewColumn",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.add_attribute(this.items[0].el , 'text', 3 );\n\tthis.el.add_attribute(this.items[0].el , 'sensitive', 3 );\n\t//this.el.add_attribute(this.items[0].el , 'editable', 3 );\n          // this.el.set_cell_data_func(cell, age_cell_data_func, NULL, NULL);\n\n \tthis.get('/LeftPanel').editableColumn= this;\n}\n",
+                                                                            "|setOptions": "function(ar) {\n       var m = this.items[0].el.model;\n            m.clear();\n            var iter = new Gtk.TreeIter();\n            ar.forEach(function(i) {\n                   // sort!!!?\n                m.append(iter);\n                m.set_value(iter, 0, i);\n            });\n            \n}\n",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "listeners": {
+                                                                                        "edited": "function (self, object, p0) {\n \tthis.get('/LeftPanel').editing = false;\n \tvar ap = this.get('/LeftPanel.model').activePath\n\tprint(\"EDITED? \"  + ap + \" - p:\" + p0 + \" t:\" + p0);\n        this.get('/LeftPanel.model').changed(p0, true);\n        this.get('/LeftPanel.model').activePath = false;\n        this.el.editable = false;\n}",
+                                                                                        "editing_started": "function (self, editable, path) {\n   this.get('/LeftPanel').editing  = true;\n\t//  console.log('editing started');\n       // r.has_entry = false;\n\n    this.el.editable = false; // make sure it's not editor...\n   \n}"
+                                                                                    },
+                                                                                    "editable": false,
+                                                                                    "pack": "pack_start",
+                                                                                    "text_column": 0,
+                                                                                    "xtype": "CellRendererCombo",
+                                                                                    "|has_entry": true,
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.model = new Gtk.ListStore();\n    this.el.model.set_column_types ( 1, [\n        GObject.TYPE_STRING  // 0 real key\n      ]);\n}\n",
+                                                                                    "|xns": "Gtk"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Menu",
+                                                                    "pack": false,
+                                                                    "id": "LeftPanelPopup",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "MenuItem",
+                                                                            "pack": "append",
+                                                                            "label": "Delete",
+                                                                            "listeners": {
+                                                                                "activate": "function (self) {\n\tthis.get('/LeftPanel.model').deleteSelected();\n}"
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "MenuItem",
+                                                                            "pack": "append",
+                                                                            "label": "Edit",
+                                                                            "listeners": {
+                                                                                "activate": "function (self) {\n\tthis.get('/LeftPanel.model').startEditing(false, 0);\n}"
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "ScrolledWindow",
+                                            "pack": "pack_end,false,true,0",
+                                            "id": "MidPropTree",
+                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n       XObject.prototype.init.call(this); \n    this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)\n    this.el.set_size_request ( 150, -1 );\n    this.shown = true;\n}\n",
+                                            "activeElement": false,
+                                            "|hideWin": "function() {\n     \n    if (!this.shown) {\n        return;\n    }\n    \n    \n    if (this.get('/Window.left').el.position < 160) {\n        return;\n    }\n    this.get('/Window.left').el.position = this.get('/Window.left').el.position  - 150;\n        \n    this.el.hide();\n    this.shown = false;\n}\n",
+                                            "items": [
+                                                {
+                                                    "listeners": {
+                                                        "cursor_changed": "function (self) {\n       var iter = new Gtk.TreeIter();\n                        \n                        //console.log('changed');\n        var m = this.get('model');\n\tif (!this.selection){\n\t\tthis.selection = this.el.get_selection();\n\t}\n\n        var s = this.selection;\n        if (!s.get_selected(m.el, iter)) {\n\t\treturn; \n\t}\n        var tp = m.el.get_path(iter).to_string();\n        \n        \n        // var val = \"\";\n        \n        var key = m.getValue(tp, 0);\n        \n        var type = m.getValue(tp, 1);\n        var skel = m.getValue(tp, 3);\n        var etype = m.getValue(tp, 5);\n        \n        \n        this.get('/MidPropTree').hideWin();\n\n        if (type.toLowerCase() == 'function') {\n            \n            if (etype != 'events') {\n                key = '|' + key;\n            }\n            \n            this.get('/LeftPanel.model').add({\n                key :  key, \n                type : type,\n                val  : skel,\n                etype : etype\n            })  \n            return;\n        }\n        // has dot in name, and is boolean???? this does not make sense..\n        //if (type.indexOf('.') > -1 ||  type.toLowerCase() == 'boolean') {\n        //     key = '|' + key;\n       // }\n        \n        this.get('/LeftPanel.model').add( {\n            key : key, \n            type : type,\n            //skel  : skel,\n            etype : etype\n           }) //, \n}"
+                                                    },
+                                                    "pack": "add",
+                                                    "tooltip_column": 2,
+                                                    "xtype": "TreeView",
+                                                    "|enable_tree_lines": true,
+                                                    "|headers_visible": false,
+                                                    "|init": "function() {\n\tXObject.prototype.init.call(this); \n                    \n       var description = new Pango.FontDescription.c_new();\n     description.set_size(8000);\n    this.el.modify_font(description);     \n                    \n    //this.selection = this.el.get_selection();\n    // this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n \n\n    \n  \n    \n}\n",
+                                                    "|xns": "Gtk",
+                                                    "items": [
+                                                        {
+                                                            "id": "model",
+                                                            "pack": "set_model",
+                                                            "xtype": "ListStore",
+                                                            "|getValue": "function(treepath, col)\n{\n    var tp = new Gtk.TreePath.from_string (treepath);\n    var iter = new Gtk.TreeIter();\n    this.el.get_iter (iter, tp);\n    var value = new GObject.Value('');\n    this.el.get_value(iter, col, value);\n    return value.value;\n    \n}",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.set_column_types ( 6, [\n        GObject.TYPE_STRING,  // real key\n         GObject.TYPE_STRING, // real type\n         GObject.TYPE_STRING, // docs ?\n         GObject.TYPE_STRING, // visable desc\n         GObject.TYPE_STRING, // function desc\n         GObject.TYPE_STRING // element type (event|prop)\n        \n    ] );\n}\n",
+                                                            "|showData": "function(type) {\n    this.el.clear();\n            if (!this.get('/MidPropTree').activeElement || !type) {\n                return; // no active element\n            }\n\n            var fullpath = this.get('/LeftTree.model').file.guessName(this.get('/MidPropTree').activeElement);\n            var palete = this.get('/LeftTree').getPaleteProvider();\n            \n             \n            \n            Seed.print('Showing right?');\n            if (!this.get('/MidPropTree').shown) {\n\n                this.get('/Window.left').el.position = this.get('/Window.left').el.position  + 150;\n                this.get('/MidPropTree').el.show();\n                this.get('/MidPropTree').shown = true;\n            }\n            \n            var elementList = palete.getPropertiesFor(fullpath, type).sort(function(a,b) { \n                return a.name >  b.name ? 1 : -1;\n            });\n            print (\"GOT \" + elementList.length + \" items for \" + fullpath + \"|\" + type);\n           // console.dump(elementList);\n           \n            \n            var iter = new Gtk.TreeIter();\n            for(var i =0 ; i < elementList.length; i++) {\n                var p=elementList[i];\n                this.el.append(iter);\n              //  console.log( '<b>' + p.name +'</b> ['+p.type+']');\n                    //GObject.TYPE_STRING,  // real key\n                    // GObject.TYPE_STRING, // real type\n                    // GObject.TYPE_STRING, // docs ?\n                    // GObject.TYPE_STRING // func def?\n                    \n                \n                this.el.set_value(iter, 0, p.name);\n                this.el.set_value(iter, 1, p.type);\n                this.el.set_value(iter, 2, '<span size=\"small\"><b>' + p.name +'</b> ['+p.type+']</span>' + \"\\n\" + p.desc);\n                this.el.set_value(iter, 3, p.sig ? p.sig  : '');\n                this.el.set_value(iter, 4, '<span size=\"small\"><b>' + p.name +'</b> ['+p.type+']</span>');\n                this.el.set_value(iter, 5, type);\n                \n            }\n                             \n}\n",
+                                                            "|xns": "Gtk"
+                                                        },
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "TreeViewColumn",
+                                                            "|init": "function() {\n    this.el = new Gtk.TreeViewColumn();\n    this.parent.el.append_column(this.el);\n    \n    XObject.prototype.init.call(this);\n    this.el.add_attribute(this.items[0].el , 'markup', 4  );\n}\n",
+                                                            "pack": false,
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "CellRendererText",
+                                                                    "pack": "pack_start,true"
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    "|xns": "Gtk",
+                                    "xtype": "HBox",
+                                    "pack": "add",
+                                    "items": [
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "VPaned",
+                                            "pack": "add",
+                                            "position": 300,
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "pack": "add",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "Notebook",
+                                                            "pack": "pack_start,true,true",
+                                                            "id": "view-help-nb",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Preview\" }));\n    this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : \"Help\" }));\n}\n",
+                                                            "items": [
+                                                                {
+                                                                    "id": "view-notebook",
+                                                                    "pack": "add",
+                                                                    "tab_border": 0,
+                                                                    "xtype": "Notebook",
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_current_page(0);\n    //print(\"SET LABEL?\")\n    this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Roo View\" }));\n    this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : \"Gtk View\" }));\n}\n",
+                                                                    "|show_tabs": false,
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "id": "RightBrowser",
+                                                                            "pack": "add",
+                                                                            "xtype": "VBox",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "pack": "pack_start,false,true,0",
+                                                                                    "xtype": "HBox",
+                                                                                    "|xns": "Gtk",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "clicked": "function (self) {\n  this.get('/RightBrowser.view').renderJS(null,true);\n}"
+                                                                                            },
+                                                                                            "label": "Redraw",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "xtype": "Button",
+                                                                                            "|xns": "Gtk"
+                                                                                        },
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "toggled": "function (self, state) {\n    this.el.set_label(this.el.active  ? \"Auto Redraw On\" : \"Auto Redraw Off\");\n}"
+                                                                                            },
+                                                                                            "active": true,
+                                                                                            "id": "AutoRedraw",
+                                                                                            "label": "Auto Redraw On",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "xtype": "CheckButton",
+                                                                                            "|xns": "Gtk"
+                                                                                        },
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "clicked": "function (self) {\n  this.get('/RightBrowser.view').redraws = 99;\n  this.get('/RightBrowser.view').renderJS(null,true);\n}"
+                                                                                            },
+                                                                                            "label": "Full Redraw",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "xtype": "Button",
+                                                                                            "|xns": "Gtk"
+                                                                                        }
+                                                                                    ]
+                                                                                },
+                                                                                {
+                                                                                    "pack": "add",
+                                                                                    "xtype": "ScrolledWindow",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n}\n",
+                                                                                    "|shadow_type": "Gtk.ShadowType.IN",
+                                                                                    "|xns": "Gtk",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "listeners": {
+                                                                                                "load_finished": "function (self, object) {\n    print(\"load finished\");\n//    print(\"load_finished\"); return;\n\t// if (this.ready) { // dont do it twice!\n\t //   return; \n\t//}\n\tif (!this.inspectorShown) {\n           this.el.get_inspector().show();\n           this.inspectorShown = true;\n\t}\n\n\tthis.ready = true;\n\t\n        if (this.pendingRedraw) {\n            this.pendingRedraw = false;\n            this.refreshRequired  = true;\n        }\n        //var js = this.get('/LeftTree.model').toJS();\n        //if (js && js[0]) {\n    \t//    this.renderJS(js[0]);\n    \t//}\n\n}",
+                                                                                                "script_alert": "function (self, object, p0) {\n    // \tprint(p0);\n        return false;\n        return true; // do not display anything...\n}",
+                                                                                                "console_message": "function (self, object, p0, p1) {\n    print(object);\n   //  console.log(object);\n   \n\n    if (object.match(/variable/) && object.match(/Builder/)) {\n        print(\"got builder missing message\");\n        this.refreshRequired = true;\n        this.lastRedraw = 0;\n        this.runRefresh();\n        return true;\n    }\n    \n   \n        if (!object.match(/^\\{/)) {\n        \n            //this.get('/Terminal').feed(object);\n            return true; // do not handle!!! -> later maybe in console..\n        }\n        \n        \n        \n        \n       // console.log(object);\n        var val =  JSON.parse(object);\n\n        if (typeof(val['hover-node']) != 'undefined') {\n            this.activeNode = val['hover-node'];\n            console.log('active node: ' + this.activeNode);\n            return true;\n        }\n\n         var ret = false;\n         if (typeof(val['id']) != 'undefined') {\n           // this.activeNode = val['id'];\n            var tg = this.get('/LeftTree.model').findDropNode(val['id'], true); \n            if (!tg || typeof(tg[0]) == 'undefined') {\n                return false;\n            }\n            print(\"SELECT node \" + tg[0]);\n            \n            this.get('/LeftTree.view').selectNode(tg[0]);\n            ret  = true;\n            \n        } \n        if (ret && typeof(val['set']) != 'undefined') {\n           this.get('/LeftPanel.model').add({\n                key : val['set'],\n                val : val['value']\n            });\n            //console.log('active node: ' + this.activeNode);\n            \n        }\n        //Seed.print('a:'+a);\n        //Seed.print('b:'+b);\n        //Seed.print('c:'+c);\n        return ret;\n}",
+                                                                                                "drag_motion": "function (w, ctx,  x,   y,   time, ud) {\n   // console.log('DRAG MOTION'); \n        // status:\n        // if lastCurrentNode == this.currentNode.. -- don't change anything..\n        this.targetData = [];\n        this.el.execute_script(\"Builder.overPos(\" + x +','+ y + \");\");\n        \n        // A) find out from drag all the places that node could be dropped.\n        var src = Gtk.drag_get_source_widget(ctx);\n        if (!src.dropList) {\n            Gdk.drag_status(ctx, 0, time);\n            return true;\n        }\n        // b) get what we are over.. (from activeNode)\n        // tree is empty.. - list should be correct..\n        if (!this.get('/LeftTree.model').currentTree) {\n            Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n            return true;\n            \n        }\n        // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)\n        \n        var tg = this.get('/LeftTree.model').findDropNode(this.activeNode, src.dropList);\n        console.dump(tg);\n        if (!tg.length) {\n            Gdk.drag_status(ctx, 0,time);\n            this.get('/LeftTree.view').highlight(false);\n            return true;\n        }\n         \n        // if we have a target..\n        // -> highlight it! (in browser)\n        // -> highlight it! (in tree)\n        \n        Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n        this.get('/LeftTree.view').highlight(tg);\n        this.targetData = tg;\n        // for tree we should handle this...\n        return true;\n}",
+                                                                                                "drag_drop": "function (w, ctx, x, y,time, ud) {\n\tprint(\"TARGET: drag-drop\");\n        var is_valid_drop_site = true;\n        \n         \n        Gtk.drag_get_data\n        (\n                w,         /* will receive 'drag-data-received' signal */\n                ctx,        /* represents the current state of the DnD */\n                this.get('/Window').atoms[\"STRING\"],    /* the target type we want */\n                time            /* time stamp */\n        );\n                        \n                        \n                        /* No target offered by source => error */\n                       \n\n\treturn  is_valid_drop_site;\n}",
+                                                                                                "drag_data_received": "function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) \n    {\n        print(\"Browser: drag-data-received\");\n        var delete_selection_data = false;\n        vardnd_success = false;\n        /* Deal with what we are given from source */\n        if( sel_data && sel_data.length ) {\n            \n            if (ctx.action == Gdk.DragAction.ASK)  {\n                /* Ask the user to move or copy, then set the ctx action. */\n            }\n\n            if (ctx.action == Gdk.DragAction.MOVE) {\n                delete_selection_data = true;\n            }\n            var source = Gtk.drag_get_source_widget(ctx);\n\n            print(\"Browser: source.DRAGDATA? \" + source.dragData);\n            if (this.targetData) {\n                print(this.targetData);\n                this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);\n            }\n            \n            \n            \n            dnd_success = true;\n\n        }\n\n        if (dnd_success == false)\n        {\n                Seed.print (\"DnD data transfer failed!\\n\");\n        }\n        \n        Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);\n        return true;\n    }",
+                                                                                                "create_web_view": "function (self, object) {\n  print(\"CREATE WEB VIEW\");\n   return null; //new WebKit.WebView();\n}"
+                                                                                            },
+                                                                                            "id": "view",
+                                                                                            "pack": "add",
+                                                                                            "redraws": 0,
+                                                                                            "xtype": "WebView",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    // this may not work!?\n    var settings =  this.el.get_settings();\n    settings.enable_developer_extras = true;\n    \n    // this was an attempt to change the url perms.. did not work..\n    // settings.enable_file_access_from_file_uris = true;\n    // settings.enable_offline_web_application_cache - true;\n    // settings.enable_universal_access_from_file_uris = true;\n    var _this = this;\n     \n     // init inspector..\n    this.el.get_inspector().signal.inspect_web_view.connect(function(wi, pg) {\n         _this.get('/BottomPane.inspector').el.show();\n         return _this.get('/BottomPane.inspector').el;\n    \n    });\n     \n     // FIXME - base url of script..\n     // we need it so some of the database features work.\n    this.el.load_html_string( \"Render not ready\" , \n            //fixme - should be a config option!\n            // or should we catch stuff and fix it up..\n            'http://localhost/app.Builder/'\n    );\n        \n        \n   //this.el.open('file:///' + __script_path__ + '/../builder.html');\n                          \n    Gtk.drag_dest_set\n    (\n            this.el,              /* widget that will accept a drop */\n            Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,\n            null,            /* lists of target to support */\n            0,              /* size of list */\n            Gdk.DragAction.COPY         /* what to do with data after dropped */\n    );\n                            \n   // print(\"RB: TARGETS : \" + LeftTree.atoms[\"STRING\"]);\n    Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);\n    \n    GLib.timeout_add_seconds(0, 1, function() {\n        //    print(\"run refresh?\");\n         _this.runRefresh(); \n         return true;\n     });\n    \n    \n}\n",
+                                                                                            "|renderJS": "function(data, force) {\n\n    // this is the public redraw call..\n    // we refresh in a loop privately..\n    var autodraw = this.get('/RightBrowser.AutoRedraw').el.active;\n    if (!autodraw && !force) {\n        print(\"Skipping redraw - no force, and autodraw off\");\n        return;\n    }\n    this.refreshRequired  = true;\n}\n",
+                                                                                            "|runRefresh": "function() \n{\n    // this is run every 2 seconds from the init..\n\n  \n    \n    if (!this.refreshRequired) {\n       // print(\"no refresh required\");\n        return;\n    }\n\n    if (this.lastRedraw) {\n       // do not redraw if last redraw was less that 5 seconds ago.\n       if (((new Date()) -  this.lastRedraw) < 5000) {\n            return;\n        }\n    }\n    \n    \n    \n    \n     if (!this.get('/Window.LeftTree').getActiveFile()) {\n        return;\n     }\n     this.refreshRequired = false;\n   //  print(\"HTML RENDERING\");\n     \n     this.get('/BottomPane').el.show();\n     this.get('/BottomPane').el.set_current_page(2);// webkit inspector\n\n    \n    var js = this.get('/LeftTree.model').toJS();\n    if (!js || !js.length) {\n        print(\"no data\");\n        return;\n    }\n    var  data = js[0];\n    this.redraws++;\n    \n     var project = this.get('/Window.LeftTree').getActiveFile().project;\n     //print (project.fn);\n     // set it to non-empty.\n     project.runhtml  =     project.runhtml  || '';\n     project.runhtml  = project.runhtml.length ?  project.runhtml : '<script type=\"text/javascript\"></script>'; \n    \n\n     this.runhtml  = this.runhtml || '';\n    \n     if ((project.runhtml != this.runhtml) || (this.redraws > 10)) {\n        // then we need to reload the browser using\n        // load_html_string..\n        \n        // then trigger a redraw once it's loaded..\n        this.pendingRedraw = true;\n         var runhtml = '<script type=\"text/javascript\">' + \"\\n\" ;\n         runhtml +=imports.File.File.read(__script_path__ + '/../builder.html.js') + \"\\n\";\n         runhtml += '</script>'+ \"\\n\" ;\n        \n        this.runhtml = project.runhtml;\n        // need to modify paths\n        \n        \n        \n        var html = imports.File.File.read(__script_path__ + '/../builder.html');\n        html = html.replace('</head>', runhtml + this.runhtml + '</head>');\n        print(\"LOAD HTML \" + html);\n        this.el.load_html_string( html , \n            //fixme - should be a config option!\n            'http://localhost/app.Builder/'\n        );\n        this.redraws = 0;\n        // should trigger load_finished! - which in truns shoudl set refresh Required;\n        return;\n    \n    }\n    \n    \n    this.renderedData = data;\n    var str = JSON.stringify(data) ;\n    \n    if (!this.ready) {\n        console.log('not loaded yet');\n    }\n    this.lastRedraw = new Date();\n\n    this.el.execute_script(\"Builder.render(\" + JSON.stringify(data) + \");\");\n     print( \"before render\" +    this.lastRedraw);\n    print( \"after render\" +    (new Date()));\n    \n}\n",
+                                                                                            "|xns": "WebKit"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            "id": "RightGtkView",
+                                                                            "pack": "add",
+                                                                            "xtype": "VBox",
+                                                                            "|redraw": "function() {\n   this.highlightWidget = false;\n    print(\"REDRAW CALLED\");\n    this.activePath = this.get('/LeftTree').getActivePath();\n    if (this.renderedEl) {\n      print(\"QUEUE DRAW CALLING\");\n      this.renderedEl.queue_draw();\n   }\n}\n",
+                                                                            "|renderJS": "function(data, withDebug)\n{\n      this.highlightWidget = false;\n   \n    this.withDebug = false;\n    while (this.get('view').el.get_children().length) {\n        var c = this.get('view').el.get_children()[0];\n        this.get('view').el.remove(c);        \n        c.destroy();\n    }\n     if (!data) {\n         return; \n    }\n    \n    var tree =  this.get('/LeftTree.model').toJS(false,true)[0];\n    // in theory tree is actually window..  \n   try {\n  \n        this.renderedEl = this.viewAdd(tree.items[0], this.get('view').el);\n      \n  } catch (e) {\n     print(e.message);\n    return;\n  }\n    this.get('view').el.set_size_request(\n        tree.default_width * 1 || 400, tree.default_height * 1 || 400\n    ) ;\n    if (this.renderedEl) {\n        this.renderedEl.set_size_request(\n            tree.default_width || 600,\n            tree.default_height || 400\n        );\n    }\n    this.get('view').el.show_all();\n    \n    \n    \n}",
+                                                                            "|showInWindow": "function() {\n  print(\"GET PROEJCT\");\n\tvar pr = this.get('/LeftProjectTree').getActiveProject();\n  \n\tconsole.log(pr.paths);\n    return;\n/*\n     var src= this.buildJS(\n\t\tthis.get('/LeftTree.model').toJS()[0], \n\t\ttrue);\n      // show term?? \n\n\n    //var x = new imports.sandbox.Context();\n    //x.add_globals();\n    //print(src);\n    try {\n        Seed.check_syntax('var e = ' + src);\n        //x.eval(src);\n    } catch( e) {\n        this.get('/Terminal').feed(e.message || e.toString() + \"\\n\");\n        this.get('/Terminal').feed(console._dump(e)+\"\\n\");\n        if (e.line) {\n            var lines = src.split(\"\\n\");\n            var start = Math.max(0, e.line - 10);\n            var end = Math.min(lines.length, e.line + 10);\n            for (var i =start ; i < end; i++) {\n                if (i == e.line) {\n                    this.get('/Terminal').feed(\">>>>>\" + lines[i] + \"\\n\");\n                    continue;\n                }\n                this.get('/Terminal').feed(lines[i] + \"\\n\");\n            }\n            \n        }\n        \n        return;\n    }\n     this.get('/BottomPane').el.set_current_page(1);\n    this.get('/Terminal').el.fork_command( null , [], [], \"/tmp\", false,false,false); \n    var cmd = \"/usr/bin/seed /tmp/BuilderGtkView.js\\n\";\n    this.get('/Terminal').el.feed_child(cmd, cmd.length);\n     /*\n    var _top = x.get_global_object()._top;\n    \n    _top.el.set_screen(Gdk.Screen.get_default()); // just in case..\n    _top.el.show_all();\n    if (_top.el.popup) {\n        _top.el.popup(null, null, null, null, 3, null);\n    }\n*/\n}\n",
+                                                                            "|viewAdd": "function(item, par)\n        {\n    // does something similar to xobject..\n    item.pack = (typeof(item.pack) == 'undefined') ?  'add' : item.pack;\n    \n    if (item.pack===false || item.pack === 'false') {  // no ;\n        return;\n    }\n    print(\"CREATE: \" + item['|xns'] + '.' + item['xtype']);\n    var type = item['|xns'] + '.' + item['xtype'];\n    \n    if (item['|xns'] == 'GtkClutter') { // we can not add this yet!\n        return false;\n    }\n    var ns = imports.gi[item['|xns']];\n    var ctr = ns[item['xtype']];\n    var ctr_args = { };\n    for(var k in item) {\n        var kv = item[k];\n        if (typeof(kv) == 'object' || typeof(kv) == 'function') {\n            continue;\n        }\n        if ( \n            k == 'pack' ||\n            k == 'items' ||\n            k == 'id' ||\n            k == 'xtype' ||\n            k == 'xdebug' ||\n            k == 'xns' ||\n            k == '|xns'\n        ) {\n            continue;\n        }\n\n\tif (k[0] == '|' && typeof(kv) == 'string') {\n\n\t\tif (kv.match(new RegExp('function'))) {\n\t\t\tcontinue;\n                }\n\t\t print(\"WASL \" + k + '=' + kv);\n\t\ttry {\n\t\t\teval( 'kv = ' + kv);\n\t\t} catch(e) {    continue; }\n                \n\t\tk = k.substring(1);\n             // print(k + '=' + kv);\n\t}\n        if (k[0] == '|') { // should be boolean or number..\n\t\tk = k.substring(1);\n\t\t//print(k + '=' + kv);\n        }\n         \n\tif (k == 'show_tabs') { // force tab showing for notebooks.\n           kv = true;\n        }\n        print(k + '=' + typeof(kv) + \" : \" + kv);\n        ctr_args[k] = kv;\n        \n    } \n    \n    \n    var el = new ctr(ctr_args);\n    \n    print(\"PACK\" + item.pack);\n    //console.dump(item.pack);\n    \n    \n    \n    \n    var args = [];\n    var pack_m  = false;\n    if (typeof(item.pack) == 'string') {\n         \n        item.pack.split(',').forEach(function(e, i) {\n            \n            if (e == 'false') { args.push( false); return; }\n            if (e == 'true') {  args.push( true);  return; }\n            if (!isNaN(parseInt(e))) { args.push( parseInt(e)); return; }\n            args.push(e);\n        });\n        //print(args.join(\",\"));\n        \n        pack_m = args.shift();\n    } else {\n        pack_m = item.pack.shift();\n        args = item.pack;\n    }\n    \n    // handle error.\n    if (pack_m && typeof(par[pack_m]) == 'undefined') {\n        throw {\n                name: \"ArgumentError\", \n                message : 'pack method not available : ' + par.id + \" : \" + par + '.' +  pack_m +\n                        \"ADDING : \" + item.id + \" \" +  el\n                    \n\t    };\n\n        return;\n    }\n    \n    console.dump(args);\n    args.unshift(el);\n    //if (XObject.debug) print(pack_m + '[' + args.join(',') +']');\n    //Seed.print('args: ' + args.length);\n    if (pack_m) {\n        par[pack_m].apply(par, args);\n    }\n    \n    var _this = this;\n    item.items = item.items || [];\n    item.items.forEach(function(ch,n) {\n\n          print (\"type:\" + type);\n          \n           print (\"ch.pack:\" + ch.pack);\n         if (type == 'Gtk.Table' && ch.pack == 'add') {\n            var c = n % item.n_columns;\n            var r = Math.floor(n/item.n_columns);\n            ch.pack = [ 'attach', c, c+1, r, r+1, \n                     typeof(ch.x_options) == 'undefined' ?  5 : ch.x_options,\n                        typeof(ch.y_options) == 'undefined' ?  5 : ch.y_options,\n                        typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding,\n                        typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding\n            ].join(',');\n        }\n    \n        _this.viewAdd(ch, el);\n    });\n    \n    \n    \n    // add the signal handlers.\n    // is it a widget!?!!?\n   \n    \n    try {\n         \n        \n        el.signal.expose_event.connect(XObject.createDelegate(this.widgetExposeEvent, this, [ item  ], true));\n        el.signal.drag_motion.connect(XObject.createDelegate(this.widgetDragMotionEvent, this,[ item  ], true));\n        el.signal.drag_drop.connect(XObject.createDelegate(this.widgetDragDropEvent, this, [ item  ], true));\n        el.signal.button_press_event.connect(XObject.createDelegate(this.widgetPressEvent, this, [ item  ], true ));\n  el.signal.button_release_event.connect(XObject.createDelegate(this.widgetReleaseEvent, this, [ item  ], true ));\n    } catch(e) {\n        // ignore!\n       }\n    \n    \n    \n    return el;\n    \n}",
+                                                                            "|widgetDragDropEvent": "function() {\n      print(\"WIDGET DRAGDROP\"); \n            return true;\n}\n",
+                                                                            "|widgetDragMotionEvent": "function() {\n     print(\"WIDGET DRAGMOTION\"); \n            return true;\n}\n",
+                                                                            "|widgetExposeEvent": "function(w, evt, ud, item) {\n    var widget = w;\n     if (this.inRender) {\n         return false;\n     }\n     \n     if ( this.highlightWidget) {\n          this.inRender = true;\n          if (item.xtreepath.substring(0, this.activePath.length) == this.activePath) {\n                 Gdk.draw_rectangle(this.highlightWidget.window, this.gc, false, this.box.x , this.box.y, this.box.w, this.box.h);\n            }\n           this.inRender = false;\n           return false;\n     }\n     \n     \n     if (this.activePath != item.xtreepath) {\n        return false;\n     }\n     \n   //  print(\"HIGHLIGHT: \" + item.xtreepath ); // draw highlight??\n     // work out the coords of the window..\n     if (!this.gc) {\n      var dr = widget.window;\n      this.gc = (new Gdk.GC.c_new(dr));\n      this.gc.set_rgb_fg_color(new Gdk.Color({ red: 0xFFFF, green: 0, blue : 0 }));\n      this.gc.set_line_attributes(4,  Gdk.LineStyle.SOLID, Gdk.CapStyle.ROUND , Gdk.JoinStyle.ROUND);\n    }\n\n    \n     var r  = evt.expose.area;\n     // console.dump([r.x, r.y, r.width, r.height ] );\n     //return false;\n//     print(widget.get_parent().toString().match(/GtkScrolledWindow/);\n     if (widget.get_parent().toString().match(/GtkScrolledWindow/)) { // eak\n         // happens with gtkscrollview embedded stuff..\n         var np =this.activePath.split(':');\n         np.pop();\n         this.activePath = np.join(':');\n         this.renderedEl.queue_draw();\n         return true;\n\n        \n     }\n\n       \n     \n     \n      this.box = {\n        x : r.x - 2,\n        y : r.y - 2,\n        w: r.width + 4,\n        h: r.height + 4\n      }; \n      // let's draw it..\n      this.inRender = true;\n\n      \n      this.highlightWidget = widget;\n    \n    \n \n\n    //  print(\"DRAW BOX\");\n       //console.dump(this.box);\n      Gdk.draw_rectangle(widget.window, this.gc, false, this.box.x , this.box.y, this.box.w,this.box.h);\n            this.inRender = false;\n            return false;\n}\n",
+                                                                            "|widgetPressEvent": "function(w,e,u,d) {\n     if (this.get('view').pressed) {\n        return false;\n     }\nthis.get('view').pressed = true;\n      print(\"WIDGET PRESS \" + d.xtreepath );       \n          this.get('/LeftTree.view').selectNode(   d.xtreepath );        \n            return false;\n}\n",
+                                                                            "|widgetReleaseEvent": "function() {\n    this.get('view').pressed = false;\n   return false;\n}\n",
+                                                                            "|xns": "Gtk",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "HBox",
+                                                                                    "pack": "pack_start,false,true,0",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "Button",
+                                                                                            "pack": "pack_start,false,false,0",
+                                                                                            "label": "Run The Application",
+                                                                                            "listeners": {
+                                                                                                "button_press_event": "function (self, event) {\n    // call render on left tree - with special option!?!\n \n    //print(\"GET PROEJCT\");\n    var pr = this.get('/LeftProjectTree').getActiveProject();\n  \n    var dir = '';\n    for (var i in pr.paths) { \n        dir = i;\n        break;\n    }\n    var runner = GLib.path_get_dirname (__script_path__) + '/gtkrun.js'; \n    this.get('/Terminal').feed(\"RUN DIR:\" + dir);\n    \n    this.get('/Terminal').el.fork_command( null , [], [], GLib.path_get_dirname (__script_path__) \n\t, false,false,false); \n    var cmd = \"/usr/bin/seed \" + runner + \" \" + dir + \"\\n\";\n    this.get('/Terminal').el.feed_child(cmd, cmd.length);\n    return false;\n  \n\n}"
+                                                                                            }
+                                                                                        }
+                                                                                    ]
+                                                                                },
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "ScrolledWindow",
+                                                                                    "pack": "add",
+                                                                                    "id": "view-sw",
+                                                                                    "|shadow_type": "Gtk.ShadowType.IN",
+                                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n}\n",
+                                                                                    "items": [
+                                                                                        {
+                                                                                            "|xns": "Gtk",
+                                                                                            "xtype": "EventBox",
+                                                                                            "pack": "add_with_viewport",
+                                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\nthis.el.modify_bg(Gtk.StateType.NORMAL, new Gdk.Color({\n            red: 0x9F00, green: 0xB800 , blue : 0xA800\n           }));\n} \n",
+                                                                                            "items": [
+                                                                                                {
+                                                                                                    "|xns": "Gtk",
+                                                                                                    "xtype": "Fixed",
+                                                                                                    "pack": "add",
+                                                                                                    "|init": "function() {\n\tXObject.prototype.init.call(this);\n\t//this.el.set_hadjustment(this.parent.el.get_hadjustment());\n\t//this.el.set_vadjustment(this.parent.el.get_vadjustment());\n \n}\n",
+                                                                                                    "items": [
+                                                                                                        {
+                                                                                                            "|xns": "Gtk",
+                                                                                                            "xtype": "EventBox",
+                                                                                                            "pack": "put,10,10",
+                                                                                                            "|init": "function() {\n\t//this.el =     new Gtk.Image.from_stock (Gtk.STOCK_HOME,  Gtk.IconSize.MENU);\n\tXObject.prototype.init.call(this);\n\n            Gtk.drag_dest_set\n            (\n                    this.el,              /* widget that will accept a drop */\n                    Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,\n                    null,            /* lists of target to support */\n                    0,              /* size of list */\n                    Gdk.DragAction.COPY         /* what to do with data after dropped */\n            );\n            \n           // print(\"RB: TARGETS : \" + LeftTree.atoms[\"STRING\"]);\n            Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);\n}\n",
+                                                                                                            "ready": false,
+                                                                                                            "|getActiveNode": "function(x,y)\n{\n   // workout what node is here..\n    return '0'; // top..\n}",
+                                                                                                            "id": "view",
+                                                                                                            "listeners": {
+                                                                                                                "drag_motion": "function (self, ctx, x, y, time) {\n    \n                // A) find out from drag all the places that node could be dropped.\n                var src = Gtk.drag_get_source_widget(ctx);\n                if (!src.dropList) {\n                    Gdk.drag_status(ctx, 0, time);\n                    return true;\n                }\n                // b) get what we are over.. (from activeNode)\n                // tree is empty.. - list should be correct..\n                if (!this.get('/LeftTree.model').currentTree) {\n                    Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n                    return true;\n                    \n                }\n                // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)\n                var activeNode = this.getActiveNode(x, y);\n                \n                \n                var tg = this.get('/LeftTree.model').findDropNode(activeNode, src.dropList);\n                console.dump(tg);\n                if (!tg.length) {\n                    Gdk.drag_status(ctx, 0,time);\n                    this.get('/LeftTree.view').highlight(false);\n                    return true;\n                }\n                 \n                // if we have a target..\n                // -> highlight it! (in browser)\n                // -> highlight it! (in tree)\n                \n                Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);\n                this.get('/LeftTree.view').highlight(tg);\n                this.targetData = tg;\n                // for tree we should handle this...\n                return true;\n}",
+                                                                                                                "drag_drop": "function (self,ctx, x, y, time) {\n\tSeed.print(\"TARGET: drag-drop\");\n        var is_valid_drop_site = true;\n        \n         \n        Gtk.drag_get_data\n        (\n                self,         /* will receive 'drag-data-received' signal */\n                ctx,        /* represents the current state of the this.gDnD */\n                this.get('/Window').atoms[\"STRING\"],    /* the target type we want */\n                time            /* time stamp */\n        );\n        \n        \n        /* No target offered by source => error */\n       \n\n        return  is_valid_drop_site;\n  \n}",
+                                                                                                                "drag_data_received": "function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) \n    {\n        Seed.print(\"GtkView: drag-data-received\");\n        var delete_selection_data = false;\n        var dnd_success = false;\n        /* Deal with what we are given from source */\n        if( sel_data && sel_data.length ) {\n            \n            if (ctx.action == Gdk.DragAction.ASK)  {\n                /* Ask the user to move or copy, then set the ctx action. */\n            }\n\n            if (ctx.action == Gdk.DragAction.MOVE) {\n                delete_selection_data = true;\n            }\n            var source = Gtk.drag_get_source_widget(ctx);\n\n            Seed.print(\"Browser: source.DRAGDATA? \" + source.dragData);\n            if (this.targetData) {\n                Seed.print(this.targetData);\n                this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);\n            }\n            \n            \n            \n            dnd_success = true;\n\n        }\n\n        if (dnd_success == false)\n        {\n                Seed.print (\"DnD data transfer failed!\\n\");\n        }\n        \n        Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);\n        return true;\n    }",
+                                                                                                                "button_press_event": "function (self, event) {\n  this.pressed = false;\n    return false;\n}"
+                                                                                                            }
+                                                                                                        }
+                                                                                                    ]
+                                                                                                }
+                                                                                            ]
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    "id": "Help",
+                                                                    "pack": "add",
+                                                                    "xtype": "ScrolledWindow",
+                                                                    "|show": "function() {\n    \n    var file = this.get('/LeftTree').getActiveFile();\n    if (!file) {\n        return;\n    }\n    var activeEl = this.get('/LeftTree').getActiveElement();\n    var xtype = file.guessName( activeEl )\n    if (!xtype || !xtype.length) {\n        return;\n    }\n    //this.get('/Window.view-help-nb').el.set_current_page(1);\n    \n    // get the active element being edited.\n    var helpurl = file.getHelpUrl(xtype);       \n    \n    // now load the help info in the page..\n    this.get('help-view').el.open(helpurl);\n}\n",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "WebKit",
+                                                                            "xtype": "WebView",
+                                                                            "pack": "add",
+                                                                            "id": "help-view",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n   this.get('/Window.help-view').el.open(\n     \"http://devel.akbkhome.com/seed/\");\n\n}\n",
+                                                                            "zoom_level": 0.8
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    "id": "BottomPane",
+                                                    "pack": "add",
+                                                    "xtype": "Notebook",
+                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n\t//this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Code Editor\" }));\n    \tthis.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : \"Console\" }));\n    \tthis.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : \"Inspector\" }));\n}\n",
+                                                    "|xns": "Gtk",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "ScrolledWindow",
+                                                            "pack": "add",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Vte",
+                                                                    "xtype": "Terminal",
+                                                                    "pack": "add",
+                                                                    "id": "Terminal",
+                                                                    "|feed": "function(istr) {\n    var str = istr.replace(/\\n/g, \"\\r\\n\") + \"\\r\\n\";\n    // we should make ourselves visable!!!\n    this.get('/BottomPane').el.show();\n    this.get('/BottomPane').el.set_current_page(1);\n\n    this.el.feed(str ,str.length);\n}\n",
+                                                                    "|scroll_on_output": true,
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.set_size (80, 1000);\n}\n",
+                                                                    "scrollback_lines": 1000
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "xtype": "ScrolledWindow",
+                                                            "|xns": "Gtk",
+                                                            "pack": "add",
+                                                            "listeners": {},
+                                                            "items": [
+                                                                {
+                                                                    "id": "inspector",
+                                                                    "pack": "add",
+                                                                    "xtype": "WebView",
+                                                                    "|xns": "WebKit"
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            "|xns": "Gtk",
+                                            "xtype": "VBox",
+                                            "pack": "pack_start,false,false",
+                                            "id": "RightPalete",
+                                            "|hide": "function() {\n    \n      this.get('buttonbar').el.show();\n       this.get('viewbox').el.hide();\n    print(\"TRIED TO HIDE\");\n}\n",
+                                            "|show": "function() {\n    this.get('buttonbar').el.hide();\n    this.get('viewbox').el.show();\n   // this.get('model').expanded();\n            \n}\n",
+                                            "provider": false,
+                                            "items": [
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "pack": "add",
+                                                    "id": "buttonbar",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "Button",
+                                                            "pack": "pack_start,false,true",
+                                                            "listeners": {
+                                                                "clicked": "function (self) {\n\tthis.get('/RightPalete').show();\n}"
+                                                            },
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Image",
+                                                                    "pack": "add",
+                                                                    "|stock": "Gtk.STOCK_GOTO_FIRST",
+                                                                    "|icon_size": "Gtk.IconSize.MENU"
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "Label",
+                                                            "pack": "add",
+                                                            "label": "Palete",
+                                                            "angle": 270,
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.add_events ( Gdk.EventMask.BUTTON_MOTION_MASK );\n}\n",
+                                                            "listeners": {
+                                                                "enter_notify_event": "function (self, event) {\n    this.get('/RightPalete').show();\n    return false;\n}"
+                                                            }
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    "|xns": "Gtk",
+                                                    "xtype": "VBox",
+                                                    "pack": "add",
+                                                    "id": "viewbox",
+                                                    "items": [
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "HBox",
+                                                            "pack": "pack_start,false,true",
+                                                            "items": [
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Label",
+                                                                    "pack": "add",
+                                                                    "label": "Palete"
+                                                                },
+                                                                {
+                                                                    "|xns": "Gtk",
+                                                                    "xtype": "Button",
+                                                                    "pack": "pack_start,false,true",
+                                                                    "listeners": {
+                                                                        "clicked": "function (self) {\n\tthis.get('/RightPalete').hide();\n}"
+                                                                    },
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "Image",
+                                                                            "pack": "add",
+                                                                            "|stock": "Gtk.STOCK_GOTO_LAST",
+                                                                            "|icon_size": "Gtk.IconSize.MENU"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            "|xns": "Gtk",
+                                                            "xtype": "ScrolledWindow",
+                                                            "pack": "add",
+                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);\n    this.el.set_size_request(-1,200);\n}\n",
+                                                            "|shadow_type": "Gtk.ShadowType.IN",
+                                                            "items": [
+                                                                {
+                                                                    "listeners": {
+                                                                        "drag_begin": "function (self, ctx) {\n    // we could fill this in now...\n        Seed.print('SOURCE: drag-begin');\n        \n        \n        \n        var iter = new Gtk.TreeIter();\n        var s = this.selection;\n        s.get_selected(this.get('/RightPalete.model').el, iter);\n        var path = this.get('/RightPalete.model').el.get_path(iter);\n        \n        var pix = this.el.create_row_drag_icon ( path);\n            \n                \n        Gtk.drag_set_icon_pixmap (ctx,\n            pix.get_colormap(),\n            pix,\n            null,\n            -10,\n            -10);\n        \n        var value = new GObject.Value('');\n        this.get('/RightPalete.model').el.get_value(iter, 0, value);\n        if (!this.get('/RightPalete').provider) {\n            return false;\n        }\n        this.el.dropList = this.get('/RightPalete').provider.getDropList(value.value);\n        this.el.dragData = value.value;\n        \n        \n        \n        \n        return true;\n}",
+                                                                        "drag_data_get": "function (self, drag_context, selection_data, info, time) {\n \t//Seed.print('Palete: drag-data-get: ' + target_type);\n        if (this.el.dragData && this.el.dragData.length ) {\n            selection_data.set_text(this.el.dragData ,this.el.dragData.length);\n        }\n        \n        \n        //this.el.dragData = \"TEST from source widget\";\n        \n        \n}",
+                                                                        "drag_end": "function (self, drag_context) {\n \tSeed.print('SOURCE: drag-end');\n\tthis.el.dragData = false;\n\tthis.el.dropList = false;\n\tthis.get('/LeftTree.view').highlight(false);\n\treturn true;\n}",
+                                                                        "button_press_event": "function (self, event) {\n\n \tif (!this.get('/Editor').save()) {\n \t    // popup!! - click handled.. \n \t    return true;\n        }\n    return false;\n}"
+                                                                    },
+                                                                    "pack": "add",
+                                                                    "xtype": "TreeView",
+                                                                    "|enable_tree_lines": true,
+                                                                    "|headers_visible": false,
+                                                                    "|init": "function() {\n    XObject.prototype.init.call(this);\n  this.el.set_size_request(150,-1);\n                          //  set_reorderable: [1]\n                                  \n            var description = new Pango.FontDescription.c_new();\n    description.set_size(8000);\n    this.el.modify_font(description);\n    \n    this.selection = this.el.get_selection();\n    this.selection.set_mode( Gtk.SelectionMode.SINGLE);\n   // this.selection.signal['changed'].connect(function() {\n    //    _view.listeners['cursor-changed'].apply(_view, [ _view, '']);\n    //});\n    // see: http://live.gnome.org/GnomeLove/DragNDropTutorial\n     \n    Gtk.drag_source_set (\n            this.el,            /* widget will be drag-able */\n            Gdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */\n            null,            /* lists of target to support */\n            0,              /* size of list */\n            Gdk.DragAction.COPY         /* what to do with data after dropped */\n    );\n    //Gtk.drag_source_set_target_list(this.el, LeftTree.targetList);\n   \n    Gtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);\n    Gtk.drag_source_add_text_targets(this.el); \n    /*\n    print(\"RP: TARGET:\" + LeftTree.atoms[\"STRING\"]);\n    targets = new Gtk.TargetList();\n    targets.add( LeftTree.atoms[\"STRING\"], 0, 0);\n    targets.add_text_targets( 1 );\n    Gtk.drag_dest_set_target_list(this.el, LeftTree.targetList);\n    \n    //if you want to allow text to be output elsewhere..\n    //Gtk.drag_source_add_text_targets(this.el);\n    */\n    return true; \n}\n",
+                                                                    "|xns": "Gtk",
+                                                                    "items": [
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "ListStore",
+                                                                            "pack": "set_model",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\nthis.el.set_column_types ( 2, [\n                            GObject.TYPE_STRING, // title \n                            GObject.TYPE_STRING // tip\n                            \n                            ] );\n}\n",
+                                                                            "id": "model",
+                                                                            "|load": "function(tr,iter)\n{\n    if (!iter) {\n        this.el.clear();\n    }\n    //console.log('Project tree load: ' + tr.length);\n    var citer = new Gtk.TreeIter();\n    //this.insert(citer,iter,0);\n    for(var i =0 ; i < tr.length; i++) {\n        if (!iter) {\n            \n            this.el.append(citer);   \n        } else {\n            this.el.insert(citer,iter,-1);\n        }\n        \n        var r = tr[i];\n        //Seed.print(r);\n        this.el.set_value(citer, 0,  '' +  r ); // title \n        \n        //this.el.set_value(citer, 1,  new GObject.Value( r)); //id\n        //if (r.cn && r.cn.length) {\n        //    this.load(r.cn, citer);\n        //}\n    }\n    \n    \n}",
+                                                                            "|getValue": "function (iter, col) {\n    var gval = new GObject.Value('');\n     this.el.get_value(iter, col ,gval);\n    return  gval.value;\n    \n    \n}"
+                                                                        },
+                                                                        {
+                                                                            "|xns": "Gtk",
+                                                                            "xtype": "TreeViewColumn",
+                                                                            "pack": "append_column",
+                                                                            "|init": "function() {\n    XObject.prototype.init.call(this);\n\tthis.el.add_attribute(this.items[0].el , 'markup', 0 );\n}\n",
+                                                                            "items": [
+                                                                                {
+                                                                                    "|xns": "Gtk",
+                                                                                    "xtype": "CellRendererText",
+                                                                                    "pack": "pack_start"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                }
+            ]
+        }
+    ],
+    "permname": "",
+    "modOrder": ""
+}
\ No newline at end of file

diff --git a/Sample/Window.js b/Sample/Window.js
new file mode 100644 (file)
index 0000000..7d66a12
--- /dev/null
+++ b/Sample/Window.js
@@ -0,0 +1,4129 @@
+Gtk = imports.gi.Gtk;
+Gdk = imports.gi.Gdk;
+Pango = imports.gi.Pango;
+GLib = imports.gi.GLib;
+Gio = imports.gi.Gio;
+GObject = imports.gi.GObject;
+GtkSource = imports.gi.GtkSource;
+WebKit = imports.gi.WebKit;
+Vte = imports.gi.Vte;
+GtkClutter = imports.gi.GtkClutter;
+console = imports.console;
+XObject = imports.XObject.XObject;
+Window=new XObject({
+    xtype: Gtk.Window,
+    listeners : {
+        delete_event : function (self, event) {
+            return false;
+        },
+        destroy : function (self) {
+           Gtk.main_quit();
+        },
+        show : function (self) {
+          print("WINDOW SHOWING - trying to hide");
+        imports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();
+               this.get('/MidPropTree').hideWin();
+            this.get('/RightPalete').hide();
+            this.get('/BottomPane').el.hide();
+            //this.get('/Editor').el.show_all();
+        
+        }
+    },
+    border_width : 0,
+    default_height : 500,
+    default_width : 800,
+    id : "Window",
+    title : "Application Builder",
+    init : function() {
+         this.atoms = {
+               "STRING" : Gdk.atom_intern("STRING")
+       };
+       this.targetList = new Gtk.TargetList();
+       this.targetList.add( this.atoms["STRING"], 0, 0);
+       //imports.Builder.Provider.ProjectManager.ProjectManager.loadConfig();
+    Gtk.rc_parse_string(
+                "style \"gtkcombobox-style\" {\n" + 
+                "    GtkComboBox::appears-as-list = 1\n" +
+                "}\n"+
+                "class \"GtkComboBox\" style \"gtkcombobox-style\"\n");
+        XObject.prototype.init.call(this);
+        this.el.show_all();
+        
+       
+                  
+    },
+    setTitle : function(str) {
+        this.el.set_title(this.title + ' - ' + str);
+    },
+    type : Gtk.WindowType.TOPLEVEL,
+    items : [
+        {
+            xtype: Gtk.VBox,
+            id : "w-vbox",
+            items : [
+                {
+                    xtype: Gtk.MenuBar,
+                    pack : "pack_start,false,false",
+                    items : [
+                        {
+                            xtype: Gtk.MenuItem,
+                            use_underline : true,
+                            label : "_File",
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            use_underline : true,
+                                            label : "New _Project",
+                                            listeners : {
+                                                activate : function (self) {
+                                                         var _this = this;
+                                                       this.get('/EditProject').show({
+                                                           success : function(pr) {
+                                                                    _this.get('/LeftProjectTree').get('combo').setValue(pr.fn);
+                                                           }
+                                                       });
+                                                }
+                                            }
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            label : "_New File",
+                                            use_underline : true,
+                                            listeners : {
+                                                activate : function (self) {
+                                                       var fn = this.get('/LeftProjectTree.combo').getValue();
+                                                        if (!fn) {
+                                                            this.get('/LeftProjectTree').showNoProjectSelected();
+                                                            return true;
+                                                        }
+                                                        var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                        this.get('/DialogNewComponent').show({
+                                                            project : pm.getByFn(fn)
+                                                        });
+                                                }
+                                            }
+                                        },
+                                        {
+                                            xtype: Gtk.SeparatorMenuItem,
+                                            pack : "add"
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            use_underline : true,
+                                            pack : "add",
+                                            label : "D_elete Project",
+                                            listeners : {
+                                                activate : function (self) {
+                                                
+                                                       var fn =  this.get('/LeftProjectTree').get('combo').getValue();
+                                                       if (!fn.length) {
+                                                               this.get('/StandardErrorDialog').show("Select a project")
+                                                               return;
+                                                        }
+                                                       var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                       var pr  = pm.getByFn(fn);
+                                                
+                                                       // confirm..
+                                                       this.get('/DialogConfirm').show("Are you sure you want to delete project '" + pr.name + "'", function() {
+                                                               pm.deleteProject(fn);
+                                                               print("DELETE?");
+                                                       });
+                                                
+                                                }
+                                            }
+                                        },
+                                        {
+                                            xtype: Gtk.SeparatorMenuItem,
+                                            pack : "add"
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            pack : "add",
+                                            label : "_Quit",
+                                            use_underline : true,
+                                            listeners : {
+                                                activate : function (self) {
+                                                   Gtk.main_quit();
+                                                }
+                                            }
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.MenuItem,
+                            label : "_Edit",
+                            use_underline : true,
+                            pack : "add",
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self) {
+                                                       var fn = this.get('/LeftTree').getActiveFile();
+                                                        if (!fn) {
+                                                            this.get('/StandardErrorDialog').show("No File active");
+                                                            return true;
+                                                        }
+                                                 
+                                                        this.get('/DialogNewComponent').show(fn);
+                                                        return true;
+                                                }
+                                            },
+                                            label : "File _Properties",
+                                            pack : "add",
+                                            use_underline : true
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self, event) {
+                                                    this.get('/RooProjectProperties').show();
+                                                    return false;
+                                                }
+                                            },
+                                            label : "Modify Project HTML ",
+                                            pack : "add",
+                                            use_underline : true
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.MenuItem,
+                            label : "_View",
+                            use_underline : true,
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self, event) {
+                                                      var js = this.get('/LeftTree.model').toJS();
+                                                    if (js && js[0]) {
+                                                        this.get('/RightBrowser.view').renderJS(js[0], true);
+                                                    } 
+                                                    return false;
+                                                }
+                                            },
+                                            label : "_Redraw (Roo)",
+                                            pack : "add",
+                                            use_underline : true
+                                        },
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            listeners : {
+                                                activate : function (self, event) 
+                                                {
+                                                        /* Firefox testing for debugging..
+                                                          - we can create a /tmp directory, and put.
+                                                            builder.html, builder.html.js, link roojs1 
+                                                            add at the end of builder.html Roo.onload(function() {
+                                                         */
+                                                        if (!this.get('/Window.LeftTree').getActiveFile()) {
+                                                            return;
+                                                        }
+                                                        
+                                                        var js = this.get('/LeftTree.model').toJS();
+                                                         if (!js ||  !js[0]) {
+                                                            return;
+                                                        }
+                                                        var project = this.get('/Window.LeftTree').getActiveFile().project;
+                                                        //print (project.fn);
+                                                        
+                                                        project.runhtml  = project.runhtml || '';
+                                                
+                                                
+                                                       var File = imports.File.File;
+                                                       
+                                                       var target = "/tmp/firetest"; // fixme..
+                                                       if (!File.isDirectory(target)) {
+                                                           File.mkdir(target);
+                                                        }
+                                                       File.copy(__script_path__ + '/../builder.html.js', target+ '/builder.html.js', Gio.FileCopyFlags.OVERWRITE);
+                                                       if (!File.exists( target+ '/roojs1')) {
+                                                            File.link( target+ '/roojs1', __script_path__ + '/../roojs1');
+                                                       }
+                                                        
+                                                        
+                                                        
+                                                        var html = imports.File.File.read(__script_path__ + '/../builder.html');
+                                                        html = html.replace('</head>', project.runhtml + '</head>');
+                                                        
+                                                       
+                                                        var     jsstr = JSON.stringify(js[0], null, 4);
+                                                       
+                                                        var runbuilder = '<script type="text/javascript">' + "\n" + 
+                                                            " Builder.render(" + jsstr + ");\n" +
+                                                            '</script>';
+                                                        
+                                                        html = html.replace('</body>', runbuilder + '</body>');
+                                                
+                                                       File.write( target+ '/builder.html', html);
+                                                       
+                                                        this.get('/Terminal').feed("RUN DIR:" + target);
+                                                    
+                                                    this.get('/Terminal').el.fork_command( null , [], [], target
+                                                       , false,false,false); 
+                                                    var cmd = "firefox file://" + target + "/builder.html  \n";
+                                                    this.get('/Terminal').el.feed_child(cmd, cmd.length);
+                                                     return false;
+                                                }
+                                            },
+                                            label : "_Test in Firefox (Roo)",
+                                            pack : "add",
+                                            use_underline : true
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.MenuItem,
+                            label : "_Help",
+                            use_underline : true,
+                            pack : "add",
+                            items : [
+                                {
+                                    xtype: Gtk.Menu,
+                                    pack : "set_submenu",
+                                    items : [
+                                        {
+                                            xtype: Gtk.MenuItem,
+                                            pack : "add",
+                                            label : "_About",
+                                            use_underline : true,
+                                            listeners : {
+                                                activate : function (self) {
+                                                    this.get('/About').el.run();
+                                                }
+                                            }
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                },
+                {
+                    xtype: Gtk.HPaned,
+                    id : "left",
+                    position : 400,
+                    items : [
+                        {
+                            xtype: Gtk.HBox,
+                            items : [
+                                {
+                                    xtype: Gtk.VPaned,
+                                    position : 300,
+                                    id : "leftvpaned",
+                                    items : [
+                                        {
+                                            xtype: Gtk.VBox,
+                                            id : "LeftTopPanel",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.Expander,
+                                                    listeners : {
+                                                        activate : function (self) {
+                                                            // this does not actually expand it..
+                                                            // that is done by GTK..
+                                                            
+                                                            
+                                                               if (!this.get('/Editor').save()) {
+                                                                   // popup!! - click handled.. 
+                                                                   return true;
+                                                                }
+                                                        
+                                                            if (!this.el.expanded) {
+                                                                this.onExpand();
+                                                            } else {
+                                                                this.onCollapse();
+                                                            }
+                                                                 
+                                                        },
+                                                        enter_notify_event : function (self, event) {
+                                                        return;
+                                                             this.el.expanded = !this.el.expanded;
+                                                        //if (this.el.expanded ) {
+                                                            this.listeners.activate.call(this);
+                                                        //   }
+                                                        
+                                                        return true;
+                                                        }
+                                                    },
+                                                    id : "expander",
+                                                    label : "Select Project or File",
+                                                    pack : "pack_start,false,true",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.add_events (Gdk.EventMask.BUTTON_MOTION_MASK );
+                                                    },
+                                                    onCollapse : function() {
+                                                        
+                                                        var nb = this.get('/LeftTopPanel.notebook');
+                                                        nb.el.set_current_page(0);
+                                                    },
+                                                    onExpand : function() {
+                                                        var nb = this.get('/LeftTopPanel.notebook');            
+                                                        var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                        
+                                                       
+                                                        var model = this.get('/LeftProjectTree.combomodel');
+                                                        //  print ("loading Projects?")
+                                                        //console.dump(pm.projects);
+                                                        model.loadData(pm.projects);
+                                                         
+                                                        
+                                                        nb.el.set_current_page(1);
+                                                        //pm.on('changed', function() {
+                                                       //console.log("CAUGHT project manager change");
+                                                        //    _combo.model.loadData(pm.projects);
+                                                        //}
+                                                        return;
+                                                    }
+                                                },
+                                                {
+                                                    xtype: Gtk.Notebook,
+                                                    id : "notebook",
+                                                    pack : "pack_start,true,true",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_current_page(0);
+                                                    
+                                                    },
+                                                    show_border : false,
+                                                    show_tabs : false,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.ScrolledWindow,
+                                                            id : "LeftTree",
+                                                            pack : "add",
+                                                            getActiveElement : function() { // return path to actie node.
+                                                            
+                                                                 var path = this.getActivePath();
+                                                                 if (!path) {
+                                                                    return false;
+                                                                 }
+                                                                 var iter = new Gtk.TreeIter();
+                                                                 this.get('model').el.get_iter_from_string(iter, path);
+                                                                 
+                                                                 var value = new GObject.Value('');
+                                                                 this.get('model').el.get_value(iter, 2, value);
+                                                                    
+                                                                 return JSON.parse(value.value);
+                                                            },
+                                                            getActiveFile : function() {
+                                                                return this.get('model').file;
+                                                            },
+                                                            getActivePath : function() {
+                                                                var model = this.get('model');
+                                                                var view = this.get('view');
+                                                                if (view.selection.count_selected_rows() < 1) {
+                                                                    return false;
+                                                                }
+                                                                var iter = new Gtk.TreeIter();
+                                                            
+                                                                view.selection.get_selected(model.el, iter);
+                                                                return model.el.get_path(iter).to_string();
+                                                            },
+                                                            getPaleteProvider : function() {
+                                                                var model = this.get('model');
+                                                                var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                                return pm.getPalete(model.file.getType());
+                                                            },
+                                                            getRenderer : function() {
+                                                            
+                                                               switch( this.getActiveFile().getType()) {
+                                                                       case 'Roo':
+                                                                           return this.get('/RightBrowser.view');
+                                                                       case 'Gtk':
+                                                                           return this.get('/RightGtkView');
+                                                               }
+                                                            
+                                                            },
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                                this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)
+                                                            },
+                                                            renderView : function() {
+                                                                var render = this.getRenderer();
+                                                                var model = this.get('model');
+                                                                if (render) {
+                                                                    render.renderJS(model.toJS(false,true)[0]);
+                                                                } else {
+                                                                    print("NO RENDER JS METHOD?");
+                                                                }
+                                                            },
+                                                            shadow_type : Gtk.ShadowType.IN,
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.TreeView,
+                                                                    listeners : {
+                                                                        button_press_event : function (self, ev) {
+                                                                               console.log("button press?");
+                                                                               
+                                                                               if (!this.get('/Editor').save()) {
+                                                                                   // popup!! - click handled.. 
+                                                                                   return true;
+                                                                                }
+                                                                               
+                                                                                if (ev.type != Gdk.EventType.BUTTON_PRESS  || ev.button.button != 3) {
+                                                                                    print("click" + ev.type);
+                                                                                    return false;
+                                                                                }
+                                                                              
+                                                                            
+                                                                                var res = {}; 
+                                                                                this.get('/LeftTree.view').el.get_path_at_pos(ev.button.x,ev.button.y, res);
+                                                                                
+                                                                                if (!this.get('/LeftTreeMenu').el)  { this.get('/LeftTreeMenu').init(); }
+                                                                                
+                                                                                this.get('/LeftTreeMenu').el.set_screen(Gdk.Screen.get_default());
+                                                                                this.get('/LeftTreeMenu').el.show_all();
+                                                                                this.get('/LeftTreeMenu').el.popup(null, null, null, null, 3, ev.button.time);
+                                                                                print("click:" + res.path.to_string());
+                                                                                return false;
+                                                                        },
+                                                                        drag_begin : function (self, drag_context) {
+                                                                               print('SOURCE: drag-begin');
+                                                                                 this.targetData = false;
+                                                                                // find what is selected in our tree...
+                                                                                var iter = new Gtk.TreeIter();
+                                                                                var s = this.selection;
+                                                                                s.get_selected(this.get('/LeftTree.model').el, iter);
+                                                                        
+                                                                                // set some properties of the tree for use by the dropped element.
+                                                                                var value = new GObject.Value('');
+                                                                                this.get('/LeftTree.model').el.get_value(iter, 2, value);
+                                                                                var data = JSON.parse(value.value);
+                                                                                var xname = this.get('/LeftTree.model').file.guessName(data);
+                                                                                
+                                                                                this.el.dragData = xname;
+                                                                                this.el.dropList = this.get('/LeftTree').getPaleteProvider().getDropList(xname);
+                                                                                
+                                                                        
+                                                                                // make the drag icon a picture of the node that was selected
+                                                                                var path = this.get('/LeftTree.model').el.get_path(iter);
+                                                                                this.el.treepath = path.to_string();
+                                                                                
+                                                                                var pix = this.el.create_row_drag_icon ( path);
+                                                                                
+                                                                                Gtk.drag_set_icon_pixmap (ctx,
+                                                                                    pix.get_colormap(),
+                                                                                    pix,
+                                                                                    null,
+                                                                                    -10,
+                                                                                    -10);
+                                                                                
+                                                                                return true;
+                                                                        },
+                                                                        drag_end : function (self, drag_context) {
+                                                                               Seed.print('LEFT-TREE: drag-end');
+                                                                                this.el.dragData = false;
+                                                                                this.el.dropList = false;
+                                                                                this.targetData = false;
+                                                                                this.get('/LeftTree.view').highlight(false);
+                                                                                return true;
+                                                                        },
+                                                                        drag_motion : function (self, ctx, x, y, time) {
+                                                                            console.log("LEFT-TREE: drag-motion");
+                                                                                        var src = Gtk.drag_get_source_widget(ctx);
+                                                                        
+                                                                                        // a drag from  elsewhere...- prevent drop..
+                                                                                        if (!src.dragData) {
+                                                                                            print("no drag data!");
+                                                                                            Gdk.drag_status(ctx, 0, time);
+                                                                                            this.targetData = false;
+                                                                                            return true;
+                                                                                        }
+                                                                                        var action = Gdk.DragAction.COPY;
+                                                                                        if (src == this.el) {
+                                                                                            // unless we are copying!!! ctl button..
+                                                                                            action = ctx.actions & Gdk.DragAction.MOVE ? Gdk.DragAction.MOVE : Gdk.DragAction.COPY ;
+                                                                                        }
+                                                                                        var data = {};
+                                                                        
+                                                                                       if (!this.get('/LeftTree.model').el.iter_n_children(null)) {
+                                                                                               // no children.. -- asume it's ok..
+                                                                                               this.targetData =  [ '' , Gtk.TreeViewDropPosition.INTO_OR_AFTER , ''];
+                                                                                               Gdk.drag_status(ctx, action ,time);
+                                                                                               return true;
+                                                                                       }
+                                                                        
+                                                                                        print("GETTING POS");
+                                                                                        var isOver = this.get('/LeftTree.view').el.get_dest_row_at_pos(x,y, data);
+                                                                                        print("ISOVER? " + isOver);
+                                                                                        if (!isOver) {
+                                                                                            Gdk.drag_status(ctx, 0 ,time);
+                                                                                            return false; // not over apoint!?!
+                                                                                        }
+                                                                                        // drag node is parent of child..
+                                                                                        console.log("SRC TREEPATH: " + src.treepath);
+                                                                                        console.log("TARGET TREEPATH: " + data.path.to_string());
+                                                                                        
+                                                                                        // nned to check a  few here..
+                                                                                        //Gtk.TreeViewDropPosition.INTO_OR_AFTER
+                                                                                        //Gtk.TreeViewDropPosition.INTO_OR_BEFORE
+                                                                                        //Gtk.TreeViewDropPosition.AFTER
+                                                                                        //Gtk.TreeViewDropPosition.BEFORE
+                                                                                        
+                                                                                        if (typeof(src.treepath) != 'undefined'  && 
+                                                                                            src.treepath == data.path.to_string().substring(0,src.treepath.length)) {
+                                                                                            print("subpath drag");
+                                                                                             Gdk.drag_status(ctx, 0 ,time);
+                                                                                            return false;
+                                                                                        }
+                                                                                        
+                                                                                        // check that 
+                                                                                        //print("DUMPING DATA");
+                                                                                        //console.dump(data);
+                                                                                        // path, pos
+                                                                                        
+                                                                                        print(data.path.to_string() +' => '+  data.pos);
+                                                                                        var tg = this.get('/LeftTree.model').findDropNodeByPath(
+                                                                                            data.path.to_string(), src.dropList, data.pos);
+                                                                                            
+                                                                                        this.get('/LeftTree.view').highlight(tg);
+                                                                                        if (!tg.length) {
+                                                                                            print("Can not find drop node path");
+                                                                                            this.targetData = false;
+                                                                                            Gdk.drag_status(ctx, 0, time);
+                                                                                            return true;
+                                                                                        }
+                                                                                        //console.dump(tg);
+                                                                                        this.targetData = tg;    
+                                                                                        
+                                                                                        
+                                                                                        Gdk.drag_status(ctx, action ,time);
+                                                                                         
+                                                                                        return true;
+                                                                        },
+                                                                        drag_drop : function (w, ctx, x, y, time) {
+                                                                              Seed.print("TARGET: drag-drop");
+                                                                                               
+                                                                                                Gtk.drag_get_data
+                                                                                                (
+                                                                                                        w,         /* will receive 'drag-data-received' signal */
+                                                                                                        ctx,        /* represents the current state of the DnD */
+                                                                                                        this.get('/Window').atoms["STRING"],    /* the target type we want */
+                                                                                                        time            /* time stamp */
+                                                                                                );
+                                                                                                
+                                                                                                 
+                                                                                                /* No target offered by source => error */
+                                                                                               
+                                                                        
+                                                                                                return  true;
+                                                                        },
+                                                                        drag_data_received : function (self, ctx, x, y, sel_data, info, time) {
+                                                                                print("Tree: drag-data-received");
+                                                                        
+                                                                                      var   delete_selection_data = false;
+                                                                                       var  dnd_success = false;
+                                                                                        /* Deal with what we are given from source */
+                                                                                        if( sel_data && sel_data.length ) {
+                                                                                            
+                                                                                            if (ctx.action == Gdk.DragAction.ASK)  {
+                                                                                                /* Ask the user to move or copy, then set the ctx action. */
+                                                                                            }
+                                                                        
+                                                                                            if (ctx.action == Gdk.DragAction.MOVE) {
+                                                                                                //delete_selection_data = true;
+                                                                                            }
+                                                                                            
+                                                                                            var source = Gtk.drag_get_source_widget(ctx);
+                                                                        
+                                                                                            if (this.targetData) {
+                                                                                                if (source != this.el) {
+                                                                                                    this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);
+                                                                                                } else {
+                                                                                                    // drag around.. - reorder..
+                                                                                                     this.get('/LeftTree.model').moveNode(this.targetData, ctx.action);
+                                                                                                    
+                                                                                                    
+                                                                                                }
+                                                                                                //Seed.print(this.targetData);
+                                                                                              
+                                                                                            }
+                                                                                            
+                                                                                            
+                                                                                            
+                                                                                            // we can send stuff to souce here...
+                                                                        
+                                                                                            dnd_success = true;
+                                                                        
+                                                                                        }
+                                                                        
+                                                                                        if (dnd_success == false)
+                                                                                        {
+                                                                                                Seed.print ("DnD data transfer failed!\n");
+                                                                                        }
+                                                                        
+                                                                                        Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
+                                                                                        return true;
+                                                                        },
+                                                                        cursor_changed : function (self) {
+                                                                             if (this.blockChanges) { // probably not needed.. 
+                                                                               return true;
+                                                                             }
+                                                                             var render = this.get('/LeftTree').getRenderer();                
+                                                                           
+                                                                            
+                                                                            if (this.selection.count_selected_rows() < 1) {
+                                                                                this.get('/LeftPanel.model').load( false);
+                                                                                this.get('/MidPropTree').activeElement =  false;
+                                                                                this.get('/MidPropTree').hideWin();
+                                                                        
+                                                                                var pm = this.get('/RightPalete.model');
+                                                                                if (!this.get('/LeftTree').getPaleteProvider()) {
+                                                                                    // it may not be loaded yet..
+                                                                                    return  true;
+                                                                                }
+                                                                                pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(
+                                                                                    this.get('/LeftTree.model').listAllTypes()));
+                                                                                if (render && render.redraw) {
+                                                                                    render.redraw();
+                                                                                }
+                                                                                return true;
+                                                                            }
+                                                                                    
+                                                                                    //console.log('changed');
+                                                                                var s = this.selection;
+                                                                                  var iter = new Gtk.TreeIter();
+                                                                                s.get_selected(this.get('/LeftTree.model').el, iter);
+                                                                                
+                                                                                
+                                                                                // var val = "";
+                                                                                var value = new GObject.Value('');
+                                                                                this.get('/LeftTree.model').el.get_value(iter, 2, value);
+                                                                                this.get('/LeftTree.model').activePath = this.get('/LeftTree.model').el.get_path(iter).to_string();
+                                                                                
+                                                                                var data = JSON.parse(value.value);
+                                                                                this.get('/MidPropTree').activeElement =  data;
+                                                                                this.get('/MidPropTree').hideWin();
+                                                                                this.get('/LeftPanel.model').load( data);
+                                                                                
+                                                                                console.log(value.value);
+                                                                               // _g.button.set_label(''+value.get_string());
+                                                                        
+                                                                                var pm =this.get('/RightPalete.model');
+                                                                                pm.load(  this.get('/LeftTree').getPaleteProvider().gatherList(
+                                                                                     this.get('/LeftTree.model').listAllTypes()));
+                                                                               
+                                                                                
+                                                                                   if (render && render.redraw) {
+                                                                                    render.redraw();
+                                                                                }
+                                                                                   
+                                                                                    //Seed.print( value.get_string());
+                                                                                    return true;
+                                                                                        
+                                                                        }
+                                                                    },
+                                                                    id : "view",
+                                                                    pack : "add",
+                                                                    tooltip_column : 1,
+                                                                    enable_tree_lines : true,
+                                                                    headers_visible : false,
+                                                                    highlight : function(treepath_ar) {
+                                                                    
+                                                                            // highlighting for drag/drop
+                                                                            if (treepath_ar.length && treepath_ar[0].length ) {
+                                                                                this.el.set_drag_dest_row( 
+                                                                                        new  Gtk.TreePath.from_string( treepath_ar[0] ),  treepath_ar[1]);
+                                                                                } else {
+                                                                                    this.el.set_drag_dest_row(null, Gtk.TreeViewDropPosition.INTO_OR_AFTER);
+                                                                                }
+                                                                                 
+                                                                            },
+                                                                    init : function() {
+                                                                               XObject.prototype.init.call(this);
+                                                                       var description = new Pango.FontDescription.c_new();
+                                                                       description.set_size(8000);
+                                                                       this.el.modify_font(description);
+                                                                    
+                                                                       this.selection = this.el.get_selection();
+                                                                       this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                                       var _this = this;
+                                                                    
+                                                                       // is this really needed??
+                                                                       this.selection.signal['changed'].connect(function() {
+                                                                               _this.get('/LeftTree.view').listeners.cursor_changed.apply(
+                                                                                   _this.get('/LeftTree.view'), [ _this.get('/LeftTree.view'), '']
+                                                                               );
+                                                                       });
+                                                                    
+                                                                       Gtk.drag_source_set (
+                                                                               this.el,            /* widget will be drag-able */
+                                                                               Gdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */
+                                                                               null,            /* lists of target to support */
+                                                                               0,              /* size of list */
+                                                                               Gdk.DragAction.COPY   | Gdk.DragAction.MOVE           /* what to do with data after dropped */
+                                                                       );
+                                                                    
+                                                                       Gtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);
+                                                                    
+                                                                       Gtk.drag_source_add_text_targets(this.el); 
+                                                                       Gtk.drag_dest_set
+                                                                       (
+                                                                           this.el,              /* widget that will accept a drop */
+                                                                           Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,
+                                                                           null,            /* lists of target to support */
+                                                                           0,              /* size of list */
+                                                                           Gdk.DragAction.COPY   | Gdk.DragAction.MOVE       /* what to do with data after dropped */
+                                                                       );
+                                                                    
+                                                                       Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);
+                                                                       Gtk.drag_dest_add_text_targets(this.el);
+                                                                    },
+                                                                    selectNode : function(treepath_str) {
+                                                                        //this.selection.select_path(new  Gtk.TreePath.from_string( treepath_str));
+                                                                     var tp = new Gtk.TreePath.from_string(treepath_str);
+                                                                              this.el.set_cursor(tp, null, false);  
+                                                                          this.el.scroll_to_cell(tp, null, false, 0,0);
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.TreeStore,
+                                                                            activePath : false,
+                                                                            currentTree : false,
+                                                                            id : "model",
+                                                                            pack : "set_model",
+                                                                            changed : function(n, refresh) {
+                                                                                //     print("MODEL CHANGED CALLED" + this.activePath);
+                                                                                     if (this.activePath) {
+                                                                                        var iter = new Gtk.TreeIter();
+                                                                                        this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath))
+                                                                                        this.el.set_value(iter, 0, [GObject.TYPE_STRING, this.nodeTitle(n)]);
+                                                                                        this.el.set_value(iter, 1, [GObject.TYPE_STRING, this.nodeTitle(n)]);
+                                                                                        
+                                                                                        this.el.set_value(iter, 2, [GObject.TYPE_STRING, this.nodeToJSON(n)]);
+                                                                                    }
+                                                                                        //this.currentTree = this.toJS(false, true)[0];
+                                                                                    var d = new Date();
+                                                                                    this.file.items = this.toJS(false, false);
+                                                                                    print ("TO JS in " + ((new Date()) - d) + "ms");
+                                                                                  //  print("AFTER CHANGED");
+                                                                                    //console.dump(this.file.items);
+                                                                                    this.file.save();
+                                                                                    this.currentTree = this.file.items[0];
+                                                                                    //console.log(this.file.toSource());
+                                                                                    
+                                                                                    if (refresh) {
+                                                                                        print("REDNER BROWSER?!");
+                                                                                        this.get('/LeftTree').renderView();
+                                                                            
+                                                                                        var pm = this.get('/RightPalete.model');
+                                                                                        if (!this.get('/RightPalete').provider) {
+                                                                                            pm.load([]);
+                                                                                            return;
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        pm.load( this.get('/RightPalete').provider.gatherList(this.listAllTypes()));
+                                                                                        //imports['Builder/RightBrowser.js'].renderJS(this.toJS());
+                                                                                    }
+                                                                                         
+                                                                            },
+                                                                            deleteSelected : function() {
+                                                                                this.get('/LeftTree.view').blockChanges = true;
+                                                                                var old_iter = new Gtk.TreeIter();
+                                                                                var s = this.get('/LeftTree.view').selection;
+                                                                                s.get_selected(this.el, old_iter);
+                                                                                var path = this.el.get_path(old_iter).to_string();
+                                                                            
+                                                                                this.activePath= false;      
+                                                                                s.unselect_all();
+                                                                            
+                                                                                this.activePath= false;      
+                                                                                 var iter = new Gtk.TreeIter();
+                                                                                this.el.get_iter_from_string(iter, path);
+                                                                                this.el.remove(iter);
+                                                                                
+                                                                                // rebuild treemap. -- depreciated.!!
+                                                                                this.map = {};
+                                                                                this.treemap = { };
+                                                                                //this.toJS(null, true) // does not do anything?
+                                                                                this.activePath= false;      
+                                                                                this.changed(false,true);
+                                                                                this.get('/LeftTree.view').blockChanges = false;
+                                                                            },
+                                                                            dropNode : function(target_data, node) {
+                                                                                     print("drop Node");
+                                                                                 // console.dump(node);
+                                                                              //    console.dump(target_data);
+                                                                                    var tp = target_data[0].length ? new  Gtk.TreePath.from_string( target_data[0] ) : false;
+                                                                                    
+                                                                                    print("add " + tp + "@" + target_data[1]  );
+                                                                                    var parent = tp;
+                                                                                    var after = false;
+                                                                                    if (tp && target_data[1]  < 2) { // before or after..
+                                                                                        var ar = target_data[0].split(':');
+                                                                                        ar.pop();
+                                                                                        parent  = new  Gtk.TreePath.from_string( ar.join(':') );
+                                                                                        after = tp;
+                                                                                    }
+                                                                                    var n_iter = new Gtk.TreeIter();
+                                                                                    var iter_par = new Gtk.TreeIter();
+                                                                                    var iter_after = after ? new Gtk.TreeIter() : false;
+                                                                                    
+                                                                                    
+                                                                                    
+                                                                                    if (parent !== false) {
+                                                                                        this.el.get_iter(iter_par, parent);
+                                                                                    } else {
+                                                                                        iter_par = null;
+                                                                                    }
+                                                                                    
+                                                                                    
+                                                                                    if (tp && after) {
+                                                                                        print(target_data[1]  > 0 ? 'insert_after' : 'insert_before');
+                                                                                        this.el.get_iter(iter_after, after);
+                                                                                        this.el[ target_data[1]  > 0 ? 'insert_after' : 'insert_before'](
+                                                                                                n_iter, iter_par, iter_after);
+                                                                                        
+                                                                                    } else {
+                                                                                        this.el.append(n_iter, iter_par);
+                                                                                        
+                                                                                    }
+                                                                                    
+                                                                                    if (typeof(node) == 'string') {
+                                                                                        var ar = node.split('.');
+                                                                                        var xtype = ar.pop();
+                                                                                        
+                                                                                        node = {
+                                                                                            '|xns' : ar.join('.'),
+                                                                                            'xtype' : xtype
+                                                                                        };
+                                                                                        if (target_data.length == 3 && target_data[2].length) {
+                                                                                            node['*prop'] = target_data[2];
+                                                                                        }
+                                                                                        node = this.get('/DialogTemplateSelect').show(node);
+                                                                                        
+                                                                                    }
+                                                                                    // work out what kind of packing to use..
+                                                                                    if (typeof(node.pack) == 'undefined'  && parent !== false) {
+                                                                                        var pal = this.get('/LeftTree').getPaleteProvider();
+                                                                                        if (pal.name == 'Gtk') {
+                                                                                            var pname = pal.guessName(this.singleNodeToJS(parent.to_string()));
+                                                                                            var cname = pal.guessName(node);
+                                                                                            node.pack = pal.getDefaultPack(pname, cname);
+                                                                                        }
+                                                                                        
+                                                                                    }
+                                                                                    
+                                                                                    
+                                                                                    var xitems = [];
+                                                                                    if (node.items) {
+                                                                                        xitems = node.items;
+                                                                                        delete node.items;
+                                                                                    }
+                                                                            // load children - if it has any..
+                                                                            
+                                                                                    if (xitems) {
+                                                                                        this.load(xitems, n_iter);
+                                                                                        this.get('/LeftTree.view').el.expand_row(this.el.get_path(n_iter), true);
+                                                                                    }
+                                                                                    if (tp && (xitems || after)) {
+                                                                                        this.get('/LeftTree.view').el.expand_row(this.el.get_path(iter_par), true);
+                                                                                    }
+                                                                                    // wee need to get the empty proptypes from somewhere..
+                                                                                    
+                                                                                    //var olditer = this.activeIter;
+                                                                                    this.activePath = this.el.get_path(n_iter).to_string();
+                                                                            
+                                                                              // changed actually set's the node data..
+                                                                                    this.changed(node, true);
+                                                                                    
+                                                                                    
+                                                                                    
+                                                                                    this.get('/LeftTree.view').el.set_cursor(this.el.get_path(n_iter), null, false);
+                                                                                    
+                                                                                    //Builder.MidPropTree._model.load(node);
+                                                                                    //Builder.MidPropTree._win.hideWin();
+                                                                                    //Builder.LeftPanel._model.load( node);
+                                                                                    
+                                                                                        
+                                                                            },
+                                                                            findDropNode : function(treepath_str, targets) {
+                                                                            
+                                                                            // this is used by the dragdrop code in the roo version AFAIR..
+                                                                            
+                                                                                               var path = treepath_str.replace(/^builder-/, '');
+                                                                                        // treemap is depreciated... - should really check if model has any entries..
+                                                                            
+                                                                                        if (!this.el.iter_n_children(null)) {
+                                                                                            print("NO KEYS");
+                                                                                            return [ '',  Gtk.TreeViewDropPosition.INTO_OR_AFTER];
+                                                                                        }
+                                                                                        print("FIND treepath: " + path);
+                                                                                        //console.dump(this.treemap);
+                                                                                        
+                                                                                        if (!treepath_str.match(/^builder-/)) {
+                                                                                            return []; // nothing!
+                                                                                        }
+                                                                                        if (targets === true) {
+                                                                                            return [ path ];
+                                                                                        }
+                                                                                        return this.findDropNodeByPath(path,targets) 
+                                                                            },
+                                                                            findDropNodeByPath : function(treepath_str, targets, pref) {
+                                                                                var path = treepath_str + ''; // dupe it..
+                                                                                pref = typeof(pref) == 'undefined' ?  Gtk.TreeViewDropPosition.INTO_OR_AFTER : pref;
+                                                                                var last = false;
+                                                                                //console.dump(this.treemap);
+                                                                                while (path.length) {
+                                                                                    print("LOOKING FOR PATH: " + path);
+                                                                                    var node_data = this.singleNodeToJS(path);
+                                                                                    if (node_data === false) {
+                                                                                        print("node not found");
+                                                                                        return [];
+                                                                                    }
+                                                                                    
+                                                                                    var xname = this.get('/LeftTree.model').file.guessName(node_data);
+                                                                                    var match = false;
+                                                                                    var prop = '';
+                                                                                    targets.forEach(function(tg) {
+                                                                                        if (match) {
+                                                                                            return;;
+                                                                                        }
+                                                                                        if ((tg == xname)  ) {
+                                                                                            match = tg;
+                                                                                        }
+                                                                                        if (tg.indexOf(xname +':') === 0) {
+                                                                                            match = tg;
+                                                                                            prop = tg.split(':').pop();
+                                                                                        }
+                                                                                    });
+                                                                                    
+                                                                                    if (match) {
+                                                                                        if (last) { // pref is after/before..
+                                                                                            // then it's after last
+                                                                                            if (pref > 1) {
+                                                                                                return []; // do not allow..
+                                                                                            }
+                                                                                            return [ last, pref , prop];
+                                                                                            
+                                                                                        }
+                                                                                        return [ path , Gtk.TreeViewDropPosition.INTO_OR_AFTER , prop];
+                                                                                    }
+                                                                                    var par = path.split(':');
+                                                                                    last = path;
+                                                                                    par.pop();
+                                                                                    path = par.join(':');
+                                                                                }
+                                                                                
+                                                                                return [];
+                                                                                        
+                                                                            },
+                                                                            getIterValue : function (iter, col) {
+                                                                                var gval = new GObject.Value('');
+                                                                                this.el.get_value(iter, col ,gval);
+                                                                                return  gval.value;
+                                                                                
+                                                                                
+                                                                            },
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                             this.el.set_column_types ( 3, [
+                                                                                        GObject.TYPE_STRING, // title 
+                                                                                        GObject.TYPE_STRING, // tip
+                                                                                        GObject.TYPE_STRING // source..
+                                                                                        ] );
+                                                                            },
+                                                                            listAllTypes : function() {
+                                                                                var s = this.get('/LeftTree.view').selection;
+                                                                                print ("LIST ALL TYPES: " + s.count_selected_rows() );
+                                                                                
+                                                                                if (s.count_selected_rows() > 0) {
+                                                                                    var iter = new Gtk.TreeIter();    
+                                                                                    s.get_selected(this.el, iter);
+                                                                            
+                                                                                    // set some properties of the tree for use by the dropped element.
+                                                                                    var value = new GObject.Value('');
+                                                                                    this.el.get_value(iter, 2, value);
+                                                                                    var data = JSON.parse(value.value);
+                                                                                    
+                                                                                    
+                                                                                    var xname = this.get('/LeftTree.model').file.guessName(data);
+                                                                                    console.log('selected:' + xname);
+                                                                                    if (xname.length) {
+                                                                                        return [ xname ];
+                                                                                    }
+                                                                                    return []; // could not find it..
+                                                                                }
+                                                                                
+                                                                                var ret = [ ];
+                                                                                
+                                                                               var _this = this;
+                                                                                function addall(li)
+                                                                                {
+                                                                                    li.forEach(function(el) {
+                                                                                        // this is specific to roo!!!?
+                                                                                        if (!el) { // skip empty?
+                                                                                            return;
+                                                                                        }
+                                                                                        var fullpath =  _this.file.guessName(el);
+                                                                                        if (fullpath.length && ret.indexOf(fullpath) < 0) {
+                                                                                            ret.push(fullpath);
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        if (el.items && el.items.length) {
+                                                                                            addall(el.items);
+                                                                                        }
+                                                                                        
+                                                                                    });
+                                                                                    
+                                                                                    
+                                                                                }
+                                                                                
+                                                                                addall([this.currentTree]);
+                                                                                
+                                                                                // only if we have nothing, should we add '*top'
+                                                                                if (!ret.length) {
+                                                                                    ret = [ '*top' ];
+                                                                                }
+                                                                                //console.log('all types in tree');
+                                                                                //console.dump(ret);
+                                                                                
+                                                                                return ret;
+                                                                                                        
+                                                                            },
+                                                                            load : function(tr,iter)
+                                                                                    {
+                                                                                        var citer = new Gtk.TreeIter();
+                                                                                        //this.insert(citer,iter,0);
+                                                                                        for(var i =0 ; i < tr.length; i++) {
+                                                                                            if (iter) {
+                                                                                                this.el.insert(citer,iter,-1);
+                                                                                            } else {
+                                                                                                this.el.append(citer);
+                                                                                            }
+                                                                                            
+                                                                                            this.el.set_value(citer, 0, [GObject.TYPE_STRING, this.nodeTitle(tr[i]) ]);
+                                                                                            this.el.set_value(citer, 1, [GObject.TYPE_STRING, this.nodeTip(tr[i]) ]);
+                                                                                            this.el.set_value(citer, 2, [GObject.TYPE_STRING, this.nodeToJSON(tr[i])]);
+                                                                                            if (tr[i].items && tr[i].items.length) {
+                                                                                                this.load(tr[i].items, citer);
+                                                                                            }
+                                                                                        }     
+                                                                                    },
+                                                                            loadFile : function(f) {
+                                                                                //console.dump(f);
+                                                                                        this.el.clear();
+                                                                                        this.file = f;
+                                                                                        
+                                                                                        if (!f) {
+                                                                                            console.log('missing file');
+                                                                                            return;
+                                                                                        }
+                                                                                        
+                                                                                        // load the file if not loaded..
+                                                                                        if (f.items === false) {
+                                                                                            var _this = this;
+                                                                                            f.loadItems(function() {
+                                                                                                _this.loadFile(f);
+                                                                                            });
+                                                                                            return;
+                                                                                            
+                                                                                        }
+                                                                                        this.get('/Window').setTitle(f.project.getName() + ' - ' + f.name);
+                                                                                        
+                                                                                        if (f.items.length && typeof(f.items[0]) == 'string') {
+                                                                                        
+                                                                                            //this.get('/RightEditor').el.show();
+                                                                                            //this.get('/RightEditor.view').load( f.items[0]);
+                                                                                            return;
+                                                                                        }
+                                                                                        print("LOAD");
+                                                                                        print(JSON.stringify(f.items, null,4));
+                                                                                        //console.dump(f.items);
+                                                                                        this.load(f.items);
+                                                                                        this.get('/LeftTree.view').el.expand_all();
+                                                                            
+                                                                                        if (!f.items.length) {
+                                                                                            // single item..
+                                                                                            
+                                                                                            this.get('/Window.leftvpaned').el.set_position(80);
+                                                                                            // select first...
+                                                                                            this.get('/LeftTree.view').el.set_cursor( 
+                                                                                                new  Gtk.TreePath.from_string('0'), null, false);
+                                                                                            
+                                                                                            
+                                                                                        } else {
+                                                                                              this.get('/Window.leftvpaned').el.set_position(200);
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        //print("hide right editior");
+                                                                                        //this.get('/RightEditor').el.hide();
+                                                                                        this.get('/Editor').el.hide();
+                                                                                        //print("set current tree");
+                                                                                        this.currentTree = this.toJS(false, false)[0];
+                                                                                        //console.dump(this.currentTree);
+                                                                                        this.currentTree = this.currentTree || { items: [] };
+                                                                                        this.get('/LeftTree').renderView();
+                                                                                        //console.dump(this.map);
+                                                                                        //var RightPalete     = imports.Builder.RightPalete.RightPalete;
+                                                                                        var pm = this.get('/RightPalete.model');
+                                                                                        // set up provider..
+                                                                                        
+                                                                                        this.get('/RightPalete').provider = this.get('/LeftTree').getPaleteProvider();
+                                                                                        
+                                                                                        if (!this.get('/RightPalete').provider) {
+                                                                                            print ("********* PALETE PROVIDER MISSING?!!");
+                                                                                        }
+                                                                                        this.get('/LeftTree').renderView();
+                                                                                        
+                                                                                        pm.load( this.get('/LeftTree').getPaleteProvider().gatherList(this.listAllTypes()));
+                                                                                        
+                                                                                        
+                                                                                                
+                                                                                        this.get('/Window.view-notebook').el.set_current_page(
+                                                                                            this.get('/LeftTree.model').file.getType()== 'Roo' ? 0 : -1);
+                                                                                                
+                                                                            },
+                                                                            moveNode : function(target_data, action) {
+                                                                                 //print("MOVE NODE");
+                                                                                       // console.dump(target_data);
+                                                                                        var old_iter = new Gtk.TreeIter();
+                                                                                        var s = this.get('/LeftTree.view').selection;
+                                                                                        s.get_selected(this.el, old_iter);
+                                                                                        var node = this.nodeToJS(old_iter,false);
+                                                                                        //console.dump(node);
+                                                                                        
+                                                                                        
+                                                                                        // needs to drop first, otherwise the target_data 
+                                                                                        // treepath will be invalid.
+                                                                                        
+                                                                                        this.dropNode(target_data, node);
+                                                                                 if (action & Gdk.DragAction.MOVE) {
+                                                                                                  //          print("REMOVING OLD NODE");
+                                                                                                            this.el.remove(old_iter);
+                                                                                                            
+                                                                                        }
+                                                                                        
+                                                                                        this.activePath= false;
+                                                                                        this.changed(false,true);
+                                                                            },
+                                                                            nodeTip : function(c) {
+                                                                                var ret = this.nodeTitle(c,true);
+                                                                                var funcs = '';
+                                                                            
+                                                                                
+                                                                                for( var i in c) {
+                                                                            
+                                                                                    if (!i.length || i[0] != '|') {
+                                                                                        continue;
+                                                                                    }
+                                                                                    if (i == '|init') { 
+                                                                                        continue;
+                                                                                    }
+                                                                                    if (typeof(c[i]) != 'string') {
+                                                                                       continue;
+                                                                                    }
+                                                                                    //print("prop : " + i + ':' + c[i]);
+                                                                                    if (!c[i].match(new RegExp('function'))) {
+                                                                                        continue;
+                                                                                    }
+                                                                                    funcs += "\n<b>" + i.substring(1) + '</b> : ' + c[i].split(/\n/).shift();
+                                                                                        
+                                                                                }
+                                                                                if (funcs.length) {
+                                                                                    ret+="\n\nMethods:" + funcs;
+                                                                                }
+                                                                                return ret;
+                                                                                
+                                                                            },
+                                                                            nodeTitle : function(c, renderfull) {
+                                                                                  var txt = [];
+                                                                                c = c || {};
+                                                                                var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;
+                                                                                if (sr) txt.push('<s>');
+                                                                                if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }
+                                                                                
+                                                                                if (renderfull && c['|xns']) {
+                                                                                    txt.push(c['|xns']);
+                                                                                }
+                                                                                
+                                                                                if (c.xtype)      { txt.push(c.xtype); }
+                                                                                if (c.id)      { txt.push('<b>[id=' + c.id + ']</b>'); }
+                                                                                if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }
+                                                                                if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }
+                                                                                
+                                                                                
+                                                                                if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }
+                                                                                if (c.title)      { txt.push('<b>' + c.title + '</b>'); }
+                                                                                if (c.label)      { txt.push('<b>' + c.label+ '</b>'); }
+                                                                                if (c.header)    { txt.push('<b>' + c.header + '</b>'); }
+                                                                                if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }
+                                                                                if (c.text)       { txt.push('<b>' + c.text + '</b>'); }
+                                                                                if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }
+                                                                                if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }
+                                                                                if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }
+                                                                                
+                                                                                // for flat classes...
+                                                                                if (typeof(c['*class']) != 'undefined')  { txt.push('<b>' +  c['*class']+  '</b>'); }
+                                                                                if (typeof(c['*extends']) != 'undefined')  { txt.push(': <i>' +  c['*extends']+  '</i>'); }
+                                                                                
+                                                                                
+                                                                                if (sr) txt.push('</s>');
+                                                                                return (txt.length == 0 ? "Element" : txt.join(" "));
+                                                                            },
+                                                                            nodeToJS : function (treepath, with_id) 
+                                                                            {
+                                                                                
+                                                                                var iter = treepath;  // API used to be iter here..
+                                                                                if (typeof(iter) == 'string') {
+                                                                                    iter = new Gtk.TreeIter(); 
+                                                                                    if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {
+                                                                                        return false;
+                                                                                    }
+                                                                                } 
+                                                                                var par = new Gtk.TreeIter(); 
+                                                                                var iv = this.getIterValue(iter, 2);
+                                                                               // print("IV" + iv);
+                                                                                var k = JSON.parse(iv);
+                                                                                if (k.json && !this.el.iter_parent( par, iter  )) {
+                                                                                    delete k.json;
+                                                                                }
+                                                                                
+                                                                                if (with_id) {
+                                                                                    var treepath_str = this.el.get_path(iter).to_string();
+                                                                                    // not sure how we can handle mixed id stuff..
+                                                                                    if (typeof(k.id) == 'undefined')  {
+                                                                                        k.id =  'builder-'+ treepath_str ;
+                                                                                    }
+                                                                                    
+                                                                                    // needed??
+                                                                                    this.treemap[  treepath_str ] = k;
+                                                                                    k.xtreepath = treepath_str ;
+                                                                                    
+                                                                                }
+                                                                                if (this.el.iter_has_child(iter)) {
+                                                                                    citer = new Gtk.TreeIter();
+                                                                                    this.el.iter_children(citer, iter);
+                                                                                    k.items = this.toJS(citer,with_id);
+                                                                                }
+                                                                                return k;
+                                                                            },
+                                                                            nodeToJSON : function(c) {
+                                                                                var o  = {}
+                                                                                for (var i in c) {
+                                                                                    if (i == 'items') {
+                                                                                         continue;
+                                                                                    }
+                                                                                    o[i] = c[i];
+                                                                                }
+                                                                                return JSON.stringify(o);
+                                                                            },
+                                                                            singleNodeToJS : function (treepath) 
+                                                                                    {
+                                                                                        var iter = new Gtk.TreeIter(); 
+                                                                                        if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {
+                                                                                            return false;
+                                                                                        }
+                                                                                        
+                                                                                        var iv = this.getIterValue(iter, 2);
+                                                                                       
+                                                                                        return JSON.parse(iv);
+                                                                                        
+                                                                                    },
+                                                                            toJS : function(treepath, with_id)
+                                                                            {
+                                                                                //Seed.print("WITHID: "+ with_id);
+                                                                                var iter = treepath;  // API used to be iter here..
+                                                                                if (typeof(iter) == 'string') {
+                                                                                    iter = new Gtk.TreeIter(); 
+                                                                                    if (!this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath))) {
+                                                                                        return false;
+                                                                                    }
+                                                                                } 
+                                                                                var first = false;
+                                                                                if (!iter) {
+                                                                                    
+                                                                                    this.treemap = { }; 
+                                                                                    
+                                                                                    iter = new Gtk.TreeIter();
+                                                                                    if (!this.el.get_iter_first(iter)) {
+                                                                                        return [];
+                                                                                    }
+                                                                                    first = true;
+                                                                                } 
+                                                                                
+                                                                                var ar = [];
+                                                                                   
+                                                                                while (true) {
+                                                                                    
+                                                                                    var k = this.nodeToJS(iter, with_id); 
+                                                                                    ar.push(k);
+                                                                                    
+                                                                                    
+                                                                                    if (!this.el.iter_next(iter)) {
+                                                                                        break;
+                                                                                    }
+                                                                                }
+                                                                                
+                                                                                if (treepath === false) {
+                                                                                    //dupe!!!
+                                                                                    return JSON.parse(JSON.stringify(ar));
+                                                                                }
+                                                                                
+                                                                                return ar;
+                                                                                // convert the list into a json string..
+                                                                            
+                                                                                
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.TreeViewColumn,
+                                                                            pack : "append_column",
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                               this.el.add_attribute(this.items[0].el , 'markup', 0 );
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.CellRendererText,
+                                                                                    pack : "pack_start"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.Menu,
+                                                                    pack : false,
+                                                                    id : "LeftTreeMenu",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "add",
+                                                                            label : "Delete Element",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                     this.get('/LeftTree.model').deleteSelected();
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                     var tree = this.get('/LeftTree');
+                                                                                      var model = this.get('/LeftTree.model');
+                                                                                     var el = tree.getActivePath();
+                                                                                     print(el);
+                                                                                     var js = model.toJS(el, false);
+                                                                                    // print(JSON.stringify(js[0], null,4));
+                                                                                     this.get('/DialogSaveTemplate').show(JSON.stringify(js[0], null,4));
+                                                                                     
+                                                                                    
+                                                                                }
+                                                                            },
+                                                                            label : "Save as Template",
+                                                                            pack : "add"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.VBox,
+                                                            pack : "add",
+                                                            id : "LeftProjectTree",
+                                                            showNoProjectSelected : function() {
+                                                               this.get('/StandardErrorDialog').show("Select a Project first."); 
+                                                            },
+                                                            getActiveProject : function() {
+                                                                 return this.project;
+                                                            },
+                                                            listeners : {
+                                                                leave_notify_event : function (self, event) {
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "pack_start,false,false",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.ComboBox,
+                                                                            id : "combo",
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                                this.el.add_attribute(this.get('render').el , 'markup', 1 );  
+                                                                            },
+                                                                            getValue : function() {
+                                                                                var ix = this.el.get_active();
+                                                                                if (ix < 0 ) {
+                                                                                    return false;
+                                                                                }
+                                                                                var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;
+                                                                                if (typeof(data[ix]) == 'undefined') {
+                                                                               return false; 
+                                                                                }
+                                                                                return data[ix].fn;
+                                                                            },
+                                                                            setValue : function(fn)
+                                                                            {
+                                                                                var el = this.el;
+                                                                                el.set_active(-1);
+                                                                                var data = imports.Builder.Provider.ProjectManager.ProjectManager.projects;
+                                                                                data.forEach(function(n, ix) {
+                                                                                    if (fn == n.fn) {
+                                                                                        el.set_active(ix);
+                                                                                        return false;
+                                                                                    }
+                                                                                });
+                                                                            },
+                                                                            listeners : {
+                                                                                changed : function (self) {
+                                                                                       var fn = this.getValue();
+                                                                                       var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                                                       this.get('/LeftProjectTree.model').loadProject(pm.getByFn(fn))
+                                                                                }
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.CellRendererText,
+                                                                                    pack : "pack_start,true",
+                                                                                    id : "render"
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.ListStore,
+                                                                                    pack : "set_model",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                      this.el.set_column_types ( 2, [
+                                                                                            GObject.TYPE_STRING,  // real key
+                                                                                            GObject.TYPE_STRING // real type
+                                                                                            
+                                                                                            
+                                                                                        ] );
+                                                                                       var pm = imports.Builder.Provider.ProjectManager.ProjectManager;
+                                                                                       var _this = this;
+                                                                                       pm.on('changed', function() {
+                                                                                           print("caught changed hook on project manager - reloading data");
+                                                                                       _this.loadData(pm.projects);
+                                                                                    
+                                                                                       });
+                                                                                    },
+                                                                                    loadData : function(data) {
+                                                                                         var ov = this.get('/LeftProjectTree.combo').getValue();
+                                                                                        this.el.clear();
+                                                                                        var iter = new Gtk.TreeIter();
+                                                                                        var el = this.el;
+                                                                                        data.forEach(function(p) {
+                                                                                            
+                                                                                            el.append(iter);
+                                                                                            
+                                                                                             
+                                                                                            el.set_value(iter, 0, p.fn);
+                                                                                            el.set_value(iter, 1, p.name);
+                                                                                            
+                                                                                        });
+                                                                                        
+                                                                                        this.get('/LeftProjectTree.combo').setValue(ov);
+                                                                                    },
+                                                                                    id : "combomodel"
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.ScrolledWindow,
+                                                                    pack : "add",
+                                                                    shadow_type : Gtk.ShadowType.IN,
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                        this.el.set_policy  (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC );
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.TreeView,
+                                                                            listeners : {
+                                                                                cursor_changed : function (self) {
+                                                                                       var iter = new Gtk.TreeIter();
+                                                                                                                
+                                                                                        if (this.selection.count_selected_rows() < 1) {
+                                                                                            //XN.get('Builder.LeftTree.model').
+                                                                                            this.get('/LeftTree.model').load( false);
+                                                                                            
+                                                                                            return;
+                                                                                        }
+                                                                                        var model = this.get('/LeftProjectTree.model');
+                                                                                        //console.log('changed');
+                                                                                        var s = this.selection;
+                                                                                        s.get_selected(model, iter);
+                                                                                        value = new GObject.Value('');
+                                                                                        model.el.get_value(iter, 2, value);
+                                                                                        
+                                                                                        console.log(value.value);// id..
+                                                                                        
+                                                                                        var file = this.get('/LeftProjectTree').project.getById(value.value);
+                                                                                        
+                                                                                        file.items = false;
+                                                                                        console.log(file);
+                                                                                        
+                                                                                
+                                                                                
+                                                                                        var nb = this.get('/LeftTopPanel.expander');
+                                                                                        nb.el.expanded = false;
+                                                                                        nb.onCollapse();
+                                                                                        //nb.listeners.activate.call(nb);
+                                                                                        //_expander.el.set_expanded(false);
+                                                                                
+                                                                                        var ltm = this.get('/LeftTree.model');
+                                                                                        ltm.loadFile(file);
+                                                                                        
+                                                                                        return true;
+                                                                                }
+                                                                            },
+                                                                            id : "view",
+                                                                            tooltip_column : 1,
+                                                                            enable_tree_lines : true,
+                                                                            headers_visible : false,
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                            var description = new Pango.FontDescription.c_new();
+                                                                                                        description.set_size(8000);
+                                                                                                        this.el.modify_font(description);
+                                                                                                        
+                                                                                                        this.selection = this.el.get_selection();
+                                                                                                        this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.TreeStore,
+                                                                                    pack : "set_model",
+                                                                                    id : "model",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                      this.el.set_column_types ( 3, [
+                                                                                                        GObject.TYPE_STRING, // title 
+                                                                                                        GObject.TYPE_STRING, // tip
+                                                                                                        GObject.TYPE_STRING // id..
+                                                                                                        ] );
+                                                                                       
+                                                                                    },
+                                                                                    loadProject : function(pr) {
+                                                                                    print("LOAD PROJECT");
+                                                                                               this.el.clear();
+                                                                                                if (!pr) {
+                                                                                                    return;
+                                                                                                }
+                                                                                                
+                                                                                                this.get('/LeftProjectTree').project = pr;
+                                                                                                this.load(pr.toTree());
+                                                                                                this.get('/LeftProjectTree.view').el.expand_all();
+                                                                                    },
+                                                                                    load : function(tr,iter) {
+                                                                                      //  console.dump(tr);
+                                                                                                console.log('Project tree load: ' + tr.length);
+                                                                                                var citer = new Gtk.TreeIter();
+                                                                                                //this.insert(citer,iter,0);
+                                                                                                
+                                                                                                var _this = this;
+                                                                                                tr.forEach(function (r) {
+                                                                                                    if (!iter) {
+                                                                                                        _this.el.append(citer);   
+                                                                                                    } else {
+                                                                                                        _this.el.insert(citer,iter,-1);
+                                                                                                    }
+                                                                                                    _this.el.set_value(citer, 0,  '' + r.getTitle() ); // title 
+                                                                                                    _this.el.set_value(citer, 1, '' + r.getTitleTip()); // tip
+                                                                                                    _this.el.set_value(citer, 2, '' + r.id ); //id
+                                                                                                    if (r.cn && r.cn.length) {
+                                                                                                        _this.load(r.cn, citer);
+                                                                                                    }
+                                                                                                    
+                                                                                                });
+                                                                                    },
+                                                                                    getValue : function(iter, col) {
+                                                                                        var gval = new GObject.Value('');
+                                                                                        this.el.get_value(iter, col ,gval);
+                                                                                        return  '' + gval.value;
+                                                                                    }
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.TreeViewColumn,
+                                                                                    pack : "append_column",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                        this.el.add_attribute(this.items[0].el , 'markup', 0 );
+                                                                                    },
+                                                                                    items : [
+                                                                                        {
+                                                                                            xtype: Gtk.CellRendererText,
+                                                                                            pack : "pack_start"
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            xtype: Gtk.VBox,
+                                            items : [
+                                                {
+                                                    xtype: Gtk.HBox,
+                                                    pack : "pack_start,false,true,0",
+                                                    id : "LeftProps",
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            pack : "add",
+                                                            listeners : {
+                                                                button_press_event : function (self, event) {
+                                                                    this.get('/MidPropTree.model').showData('props');
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.Image,
+                                                                            pack : "add",
+                                                                            stock : Gtk.STOCK_ADD,
+                                                                            icon_size : Gtk.IconSize.MENU
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.Label,
+                                                                            pack : "add",
+                                                                            label : "Property"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            listeners : {
+                                                                button_press_event : function (self, event) {
+                                                                    
+                                                                       if (!this.get('/Editor').save()) {
+                                                                           // popup!! - click handled.. 
+                                                                           return true;
+                                                                        }
+                                                                        this.get('/MidPropTree.model').showData('events');
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            pack : "add",
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.Image,
+                                                                            pack : "add",
+                                                                            stock : Gtk.STOCK_ADD,
+                                                                            icon_size : Gtk.IconSize.MENU
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.Label,
+                                                                            pack : "add",
+                                                                            label : "Handler"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            listeners : {
+                                                                button_press_event : function (self, ev) {
+                                                                
+                                                                       if (!this.get('/Editor').save()) {
+                                                                           // popup!! - click handled.. 
+                                                                           return true;
+                                                                        }
+                                                                        
+                                                                       var p = this.get('/AddPropertyPopup');
+                                                                       if (!p.el) {
+                                                                               p.init();
+                                                                       }
+                                                                       p.el.set_screen(Gdk.Screen.get_default());
+                                                                        p.el.show_all();
+                                                                         p.el.popup(null, null, null, null, 3, ev.button.time);
+                                                                    return true;
+                                                                }
+                                                            },
+                                                            pack : "add",
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.HBox,
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.Image,
+                                                                            pack : "add",
+                                                                            stock : Gtk.STOCK_ADD,
+                                                                            icon_size : Gtk.IconSize.MENU
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.Label,
+                                                                            pack : "add",
+                                                                            label : "Other"
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.Menu,
+                                                                    pack : false,
+                                                                    id : "AddPropertyPopup",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Using this.get('*someid') will find any id in an application.",
+                                                                            label : "ID",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                        key : 'id', 
+                                                                                        type : 'string',
+                                                                                        val : '',
+                                                                                        //skel  : skel,
+                                                                                        etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add what type of packing is to be used",
+                                                                            label : "PACK",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                        key : 'pack', 
+                                                                                                type : 'string',
+                                                                                                val : 'add',
+                                                                                          etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Override the init method",
+                                                                            label : "INIT",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                       key : '|init', 
+                                                                                        type : 'function',
+                                                                                        val  : "function() {\n    XObject.prototype.init.call(this);\n}\n",
+                                                                                        etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.SeparatorMenuItem,
+                                                                            pack : "add"
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user defined string property",
+                                                                            label : "String",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                                 key : '', 
+                                                                                                type : 'string',
+                                                                                                val  : "",
+                                                                                                etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user defined number property",
+                                                                            label : "Number",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                                 key : '', 
+                                                                                                type : 'number',
+                                                                                                val  : 0,
+                                                                                                etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user defined boolean property",
+                                                                            label : "Boolean",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                                 key : '', 
+                                                                                                type : 'boolean',
+                                                                                                val  : false,
+                                                                                                etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.SeparatorMenuItem,
+                                                                            pack : "add"
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.MenuItem,
+                                                                            pack : "append",
+                                                                            tooltip_markup : "Add a user function boolean property",
+                                                                            label : "Function",
+                                                                            listeners : {
+                                                                                activate : function (self) {
+                                                                                
+                                                                                    this.get('/LeftPanel.model').add( {
+                                                                                           key : '|', 
+                                                                                                        type : 'function',
+                                                                                                        val  : "function() {\n    \n}\n",
+                                                                                                        etype : 'props'
+                                                                                    });
+                                                                                }
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    editing : false,
+                                                    id : "LeftPanel",
+                                                    pack : "add",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                    },
+                                                    shadow_type : Gtk.ShadowType.IN,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.TreeView,
+                                                            listeners : {
+                                                                button_press_event : function (self, ev) {
+                                                                
+                                                                    
+                                                                    if (!this.get('/Editor').save()) {
+                                                                        // popup!! - click handled.. 
+                                                                        return true;
+                                                                    }
+                                                                    var res = { }; 
+                                                                    
+                                                                    if (!this.el.get_path_at_pos(ev.button.x,ev.button.y, res)) {
+                                                                        return false; //not on a element.
+                                                                    }
+                                                                    
+                                                                     // right click.
+                                                                     if (ev.type == Gdk.EventType.BUTTON_PRESS  && ev.button.button == 3) {    
+                                                                        // show popup!.   
+                                                                        if (res.column.title == 'value' && this.get('/LeftPanel').editing) {
+                                                                            return false;
+                                                                        }
+                                                                        //if (! this.get('/LeftPanelPopup')LeftPanelPopup.el) LeftPanelPopup.init();
+                                                                        var p = this.get('/LeftPanelPopup');
+                                                                        if (!p.el) {
+                                                                            p.init();
+                                                                        }
+                                                                
+                                                                        p.el.set_screen(Gdk.Screen.get_default());
+                                                                        p.el.show_all();
+                                                                        p.el.popup(null, null, null, null, 3, ev.button.time);
+                                                                        //Seed.print("click:" + res.column.title);
+                                                                        
+                                                                        
+                                                                        return false;
+                                                                    }
+                                                                    
+                                                                     
+                                                                    if (res.column.title != 'value') {
+                                                                          //  XObject.error("column is not value?");
+                                                                        return false; // ignore.. - key click.. ??? should we do this??
+                                                                    }
+                                                                    
+                                                                    // currently editing???
+                                                                //    if (  this.activePath) {
+                                                                        
+                                                                     //   this.activePath = false;
+                                                                       // stop editing!!!!
+                                                                        if (this.get('/Editor').dirty) {
+                                                                            //if (!this.get('/Editor.buffer').checkSyntax()) {
+                                                                            //   this.get('/StandardErrorDialog').show("Fix errors in code and save.."); 
+                                                                            //   return true;
+                                                                            //    // error Dialog
+                                                                            //}
+                                                                            if (!this.get('/Editor.view').save()) {
+                                                                                return true;
+                                                                            }
+                                                                        }   
+                                                                        this.get('/LeftPanel').editableColumn.items[0].el.stop_editing();
+                                                                        this.get('/LeftPanel').editing = false;
+                                                                    
+                                                                    //    XObject.error("Currently editing?");
+                                                                     //   return false;
+                                                                   // }
+                                                                    
+                                                                    var renderer = this.get('/LeftPanel').editableColumn.items[0].el; // set has_entry..
+                                                                    
+                                                                    var type = this.get('/LeftPanel.model').getType(res.path.to_string());
+                                                                        
+                                                                    // get options for this type -- this is to support option lists etc..
+                                                                    var provider = this.get('/LeftTree').getPaleteProvider();
+                                                                    var opts = provider.findOptions(type);
+                                                                    
+                                                                    if (opts === false) {
+                                                                        // it's text etnry
+                                                                         this.get('/LeftPanel').editableColumn.setOptions([]);
+                                                                        renderer.has_entry = true;
+                                                                    } else {
+                                                                         this.get('/LeftPanel').editableColumn.setOptions(opts);
+                                                                        renderer.has_entry = false;
+                                                                    }
+                                                                    this.get('/LeftPanel.model').startEditing(res.path.to_string(), 1);
+                                                                        
+                                                                   //Seed.print("click" + ev.type);
+                                                                    //console.dump(res);
+                                                                    return false;
+                                                                
+                                                                              
+                                                                   
+                                                                }
+                                                            },
+                                                            id : "view",
+                                                            tooltip_column : 5,
+                                                            enable_tree_lines : true,
+                                                            headers_visible : false,
+                                                            init : function() {
+                                                                 XObject.prototype.init.call(this); 
+                                                                                   
+                                                                                this.selection = this.el.get_selection();
+                                                                                this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                                             
+                                                                                
+                                                                                var description = new Pango.FontDescription.c_new();
+                                                                                description.set_size(8000);
+                                                                                this.el.modify_font(description);
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.TreeStore,
+                                                                    activePath : false,
+                                                                    id : "model",
+                                                                    pack : "set_model",
+                                                                    add : function(info) {
+                                                                          // info includes key, val, skel, etype..
+                                                                                  console.dump(info);
+                                                                                type = info.type.toLowerCase();
+                                                                                var data = this.toJS();
+                                                                                
+                                                                                if (info.etype == 'events') {
+                                                                                    data.listeners = data.listeners || { };
+                                                                                    if (typeof(data.listeners[info.key]) != 'undefined') {
+                                                                                        return; //already set!
+                                                                                    }
+                                                                                } else {
+                                                                                    if (typeof(data[info.key]) != 'undefined') {
+                                                                                        return;
+                                                                                    }
+                                                                                }
+                                                                                
+                                                                                if (typeof(info.val) == 'undefined') {
+                                                                                        
+                                                                                    info.val = '';
+                                                                                    if (info.type.toLowerCase() == 'boolean') {
+                                                                                        info.val = true;
+                                                                                    }
+                                                                                    if (type == 'number') {
+                                                                                        info.val = 0;
+                                                                                    }
+                                                                                    // utf8 == string..
+                                                                                    
+                                                                                    
+                                                                                }
+                                                                                var k = info.key;
+                                                                                if (info.etype == 'events') {
+                                                                                 
+                                                                                    data.listeners[info.key] = info.val;
+                                                                                    k = '!' + info.key;
+                                                                                } else {
+                                                                                    data[info.key] = info.val;
+                                                                                }
+                                                                                
+                                                                                
+                                                                                var map = this.load(data);
+                                                                                
+                                                                                // flag it as changed to the interface..
+                                                                    
+                                                                                this.get('/LeftTree.model').changed(data, true); 
+                                                                                
+                                                                                
+                                                                                this.startEditing(map[k]);
+                                                                                 
+                                                                                /*
+                                                                                LeftPanel.get('view').el.row_activated(
+                                                                                    new Gtk.TreePath.from_string(map[k]), 
+                                                                                    LeftPanel.editableColumn.el
+                                                                                );
+                                                                                */
+                                                                    },
+                                                                    changed : function(str, doRefresh) {
+                                                                        if (!this.activePath) {
+                                                                            return;
+                                                                        }
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath));
+                                                                        
+                                                                        this.el.set_value(iter, 1, '' +str);
+                                                                        this.el.set_value(iter, 3, '' + this.toShort(str));
+                                                                        var type = this.getIterValue(iter, 4);
+                                                                    
+                                                                        this.el.set_value(iter, 5, type + ' : ' + str);
+                                                                        // update the tree...  
+                                                                    
+                                                                        this.get('/LeftTree.model').changed(this.toJS(), doRefresh); 
+                                                                    },
+                                                                    deleteSelected : function() {
+                                                                         var data = this.toJS();
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        var s = this.get('/LeftPanel.view').selection;
+                                                                        s.get_selected(this.el, iter);
+                                                                             
+                                                                           
+                                                                        var gval = new GObject.Value('');
+                                                                       this.get('/LeftPanel.model').el.get_value(iter, 0 ,gval);
+                                                                        
+                                                                        var val = gval.value;
+                                                                        if (val[0] == '!') {
+                                                                            // listener..
+                                                                            if (!data.listeners || typeof(data.listeners[  val.substring(1)]) == 'undefined') {
+                                                                                return;
+                                                                            }
+                                                                            delete data.listeners[  val.substring(1)];
+                                                                            if (!XObject.keys(data.listeners).length) {
+                                                                                delete data.listeners;
+                                                                            }
+                                                                            
+                                                                        } else {
+                                                                            if (typeof(data[val]) == 'undefined') {
+                                                                                return;
+                                                                            }
+                                                                            delete data[val];
+                                                                        }
+                                                                        
+                                                                        
+                                                                        this.load(data);
+                                                                        this.get('/LeftTree.model').changed(data, true);
+                                                                        
+                                                                    },
+                                                                    getIterValue : function(iter, col) {
+                                                                         var gval = new GObject.Value('');
+                                                                        this.get('/LeftPanel.model').el.get_value(iter, col ,gval);
+                                                                        return '' + gval.value;
+                                                                    },
+                                                                    getType : function(treepath) {
+                                                                         return this.getValue(treepath, 4);
+                                                                    },
+                                                                    getValue : function(treepath_str, col) 
+                                                                    {
+                                                                       // get's the  value in a row.. - keys - returns string, values - formats it..
+                                                                    
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        this.el.get_iter(iter, new Gtk.TreePath.from_string(treepath_str));
+                                                                        
+                                                                        var gval = new GObject.Value('');
+                                                                        this.get('/LeftPanel.model').el.get_value(iter, col ,gval);
+                                                                        var val = '' + gval.value;
+                                                                       
+                                                                        if (col != 1) {
+                                                                            return val;
+                                                                        }
+                                                                        var type = this.getType(this.el.get_path(iter).to_string());
+                                                                        //print("TYPE: " +type + " -  val:" + val);
+                                                                        switch(type.toLowerCase()) {
+                                                                            case 'number':
+                                                                            case 'uint':
+                                                                            case 'int':
+                                                                                return parseFloat(val); // Nan ?? invalid!!?        
+                                                                            case 'float':
+                                                                            case 'gfloat':
+                                                                                return 1.0 * parseFloat(val); // Nan ?? invalid!!?
+                                                                            case 'boolean':
+                                                                                return val == 'true' ? true : false;
+                                                                            default: 
+                                                                                var nv = parseFloat(val);
+                                                                                if (!isNaN(nv) && (val == ''+nv)) {
+                                                                                    return nv;
+                                                                                }
+                                                                                return val;
+                                                                        }
+                                                                                                
+                                                                    },
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                    this.el.set_column_types ( 6, [
+                                                                                                    GObject.TYPE_STRING,  // 0 real key
+                                                                                                    GObject.TYPE_STRING, // 1 real value 
+                                                                                                     GObject.TYPE_STRING,  // 2 visable key
+                                                                                                     GObject.TYPE_STRING, // 3 visable value
+                                                                                                     GObject.TYPE_STRING, // 4 need to store type of!!!
+                                                                                                      GObject.TYPE_STRING // 5 tooltip
+                                                                                                  
+                                                                                                ]);
+                                                                    },
+                                                                    load : function(ar) {
+                                                                    // might casue problesm..
+                                                                        // this.get('/Editor.RightEditor').save();
+                                                                    
+                                                                           this.get('/Editor').el.hide();
+                                                                         this.get('/Editor').activePath = false;
+                                                                    
+                                                                    
+                                                                      this.el.clear();
+                                                                                  
+                                                                        //this.get('/RightEditor').el.hide();
+                                                                        if (ar === false) {
+                                                                            return ;
+                                                                        }
+                                                                        var ret = {}; 
+                                                                        
+                                                                    
+                                                                        var provider = this.get('/LeftTree').getPaleteProvider();
+                                                                         var iter = new Gtk.TreeIter();
+                                                                         
+                                                                        // sort!!!?
+                                                                        var keys  = XObject.keys(ar);
+                                                                        keys.sort();
+                                                                        ar.listeners = ar.listeners || {};
+                                                                        
+                                                                        for (var i in ar.listeners ) {
+                                                                            this.el.append(iter);
+                                                                            var p = this.el.get_path(iter).to_string();
+                                                                            ret['!' + i] = p;
+                                                                            
+                                                                            this.el.set_value(iter, 0, '!'+  i  );
+                                                                            this.el.set_value(iter, 1, '' + ar.listeners[i]);
+                                                                            this.el.set_value(iter, 2, '<b>'+ i + '</b>');
+                                                                            
+                                                                            this.el.set_value(iter, 3, '' + this.toShort(ar.listeners[i]));
+                                                                            this.el.set_value(iter, 4, 'function');
+                                                                            this.el.set_value(iter, 5, i + ' : ' + ar.listeners[i]);
+                                                                        }
+                                                                        
+                                                                        
+                                                                       
+                                                                        var _this = this;
+                                                                        keys.forEach(function(i) {
+                                                                            if (typeof(ar[i]) == 'object') {
+                                                                                return;
+                                                                            }
+                                                                            
+                                                                            var type = provider.findType(ar, i, ar[i]);
+                                                                            
+                                                                            _this.el.append(iter);
+                                                                            var p = _this.el.get_path(iter).to_string();
+                                                                            ret[i] = p;
+                                                                            _this.el.set_value(iter, 0, ''+i);
+                                                                            _this.el.set_value(iter, 1, '' + ar[i]);  
+                                                                            _this.el.set_value(iter, 2, ''+i);
+                                                                            _this.el.set_value(iter, 3, ''+ _this.toShort(ar[i]));
+                                                                            _this.el.set_value(iter, 4, ''+type);
+                                                                            _this.el.set_value(iter, 5, type + ' : ' + ar[i]);
+                                                                        })
+                                                                        return ret;
+                                                                    },
+                                                                    startEditing : function(path,col) {
+                                                                        
+                                                                        // alled by menu 'edit' currently..
+                                                                        /**
+                                                                        * start editing path (or selected if not set..)
+                                                                        * @param {String|false} path  (optional) treepath to edit - selected tree gets
+                                                                        *     edited by default.
+                                                                        * @param {Number} 0 or 1 (optional)- column to edit. 
+                                                                        */
+                                                                        // fix tp to be the 'treepath' string (eg. 0/1/2...)
+                                                                        var tp;
+                                                                        if (typeof(path) == 'string') {
+                                                                            tp = new Gtk.TreePath.from_string(path);
+                                                                        } else {
+                                                                            var iter = new Gtk.TreeIter();
+                                                                            var s = this.get('/LeftPanel.view').selection;
+                                                                            s.get_selected(this.el, iter);
+                                                                            tp = this.el.get_path(iter);
+                                                                            path = tp.to_string();
+                                                                        }
+                                                                        
+                                                                       
+                                                                        // which colum is to be edited..
+                                                                        var colObj = false;
+                                                                        
+                                                                        // not sure what this does..
+                                                                        
+                                                                        if (typeof(col) == 'undefined') {
+                                                                            var k = this.getValue(path, 0);
+                                                                            col = 1;
+                                                                            colObj = (!k.length || k == '|') ? 
+                                                                                this.get('/LeftPanel').propertyColumn : this.get('/LeftPanel').editableColumn;
+                                                                        } else {
+                                                                            colObj = col ? this.get('/LeftPanel').editableColumn : this.get('/LeftPanel').propertyColumn;
+                                                                        }
+                                                                        
+                                                                        // make sure the pulldown is set correctly..
+                                                                        // not really needed for second col...
+                                                                        var showEditor = false;
+                                                                        this.get('/Editor').activePath = false;
+                                                                        this.get('/Editor').el.hide();
+                                                                         
+                                                                        if (col) {
+                                                                            var provider = this.get('/LeftTree').getPaleteProvider();
+                                                                            var type = this.get('/LeftPanel.model').getType(path);
+                                                                            var opts = provider.findOptions(type);
+                                                                            var renderer = this.get('/LeftPanel').editableColumn.items[0].el;
+                                                                            
+                                                                            if (opts === false) {
+                                                                                this.get('/LeftPanel').editableColumn.setOptions([]);
+                                                                                renderer.has_entry = true; 
+                                                                            } else {
+                                                                                this.get('/LeftPanel').editableColumn.setOptions(opts);
+                                                                                renderer.has_entry = false;/// - pulldowns do not have entries
+                                                                            }
+                                                                            // determine if we should use the Text editor...
+                                                                            var keyname = this.getValue(path, 0);
+                                                                            var data_value = this.getValue(path, 1);
+                                                                        
+                                                                            if ((keyname[0] == '|') || 
+                                                                                (   
+                                                                                    (typeof(data_value) == 'string' ) && 
+                                                                                    ( data_value.match(/function/g) || data_value.match(/\n/g)) // || (data_value.length > 20))
+                                                                                )) {
+                                                                                showEditor = true;
+                                                                            }
+                                                                            print("SHOW EDITOR" + showEditor ? 'YES' :'no');
+                                                                            
+                                                                        }
+                                                                        var _this = this;    
+                                                                        // end editing..
+                                                                       // this.get('/BottomPane').el.hide();
+                                                                        //this.get('/RightEditor').el.hide();
+                                                                         
+                                                                        
+                                                                        if (showEditor) {
+                                                                    
+                                                                            this.activePath = false;
+                                                                            
+                                                                            _this.get('/Editor').el.show_all();
+                                                                            GLib.timeout_add(0, 1, function() {
+                                                                    
+                                                                                //_this.get('/BottomPane').el.show();
+                                                                                 //_this.get('/RightEditor').el.show();
+                                                                                
+                                                                                _this.get('/Editor.RightEditor.view').load( _this.getValue(path, 1) );
+                                                                                
+                                                                                _this.get('/Editor').activePath = path;
+                                                                                _this.activePath = path ;
+                                                                              
+                                                                                return false;
+                                                                            });
+                                                                            return;
+                                                                        }
+                                                                          
+                                                                        
+                                                                        
+                                                                    
+                                                                        // iter now has row...
+                                                                        GLib.timeout_add(0, 100, function() {
+                                                                            _this.activePath = path;
+                                                                            colObj.items[0].el.editable = true; // esp. need for col 0..
+                                                                            _this.get('/LeftPanel.view').el.set_cursor_on_cell(
+                                                                                tp,
+                                                                                colObj.el,
+                                                                                colObj.items[0].el,
+                                                                                true
+                                                                            );
+                                                                        });
+                                                                        
+                                                                    },
+                                                                    toJS : function() {
+                                                                         var iter = new Gtk.TreeIter();
+                                                                        this.get('/LeftPanel.model').el.get_iter_first(iter);
+                                                                        var ar = {};
+                                                                           
+                                                                        while (true) {
+                                                                            
+                                                                            var k = this.getValue(this.el.get_path(iter).to_string(), 0);
+                                                                           // Seed.print(k);
+                                                                            if (k[0] == '!') {
+                                                                                ar.listeners = ar.listeners || {};
+                                                                                ar.listeners[  k.substring(1)] = this.getValue(this.el.get_path(iter).to_string(), 1);
+                                                                                
+                                                                            } else {
+                                                                                ar[ k ] = this.getValue(this.el.get_path(iter).to_string(), 1);
+                                                                            }
+                                                                            
+                                                                            if (! this.get('/LeftPanel.model').el.iter_next(iter)) {
+                                                                                break;
+                                                                            }
+                                                                        }
+                                                                        
+                                                                        
+                                                                        //print(JSON.stringify(ar));
+                                                                        return ar;
+                                                                        // convert the l
+                                                                    },
+                                                                    toShort : function(str) {
+                                                                        var a = typeof(str) == 'string' ? str.split("\n") : [];
+                                                                            return a.length > 1 ? a[0] + '....' : '' + str;
+                                                                    }
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.TreeViewColumn,
+                                                                    pack : "append_column",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                    
+                                                                        this.el.add_attribute(this.items[0].el , 'markup', 2 );
+                                                                        this.get('/LeftPanel').propertyColumn = this;
+                                                                    },
+                                                                    title : "key",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.CellRendererText,
+                                                                            pack : "pack_start",
+                                                                            listeners : {
+                                                                                editing_started : function (self, editable, path) {
+                                                                                
+                                                                                        this.get('/LeftPanel.model').activePath  = path;
+                                                                                
+                                                                                },
+                                                                                edited : function (self, object, p0) {
+                                                                                       var model = this.get('/LeftPanel.model');
+                                                                                        var path = model.activePath;
+                                                                                        var iter = new Gtk.TreeIter();
+                                                                                        model.el.get_iter(iter, new Gtk.TreePath.from_string(path));
+                                                                                        model.el.set_value(iter, 0, p0);
+                                                                                        model.el.set_value(iter, 2, p0);
+                                                                                        
+                                                                                       model.activePath = false;
+                                                                                
+                                                                                       this.get('/LeftTree.model').changed(model.toJS(), true); 
+                                                                                        this.el.editable = false;
+                                                                                }
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.TreeViewColumn,
+                                                                    pack : "append_column",
+                                                                    title : "value",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                       this.el.add_attribute(this.items[0].el , 'text', 3 );
+                                                                       this.el.add_attribute(this.items[0].el , 'sensitive', 3 );
+                                                                       //this.el.add_attribute(this.items[0].el , 'editable', 3 );
+                                                                              // this.el.set_cell_data_func(cell, age_cell_data_func, NULL, NULL);
+                                                                    
+                                                                       this.get('/LeftPanel').editableColumn= this;
+                                                                    },
+                                                                    setOptions : function(ar) {
+                                                                           var m = this.items[0].el.model;
+                                                                                m.clear();
+                                                                                var iter = new Gtk.TreeIter();
+                                                                                ar.forEach(function(i) {
+                                                                                       // sort!!!?
+                                                                                    m.append(iter);
+                                                                                    m.set_value(iter, 0, i);
+                                                                                });
+                                                                                
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.CellRendererCombo,
+                                                                            listeners : {
+                                                                                edited : function (self, object, p0) {
+                                                                                       this.get('/LeftPanel').editing = false;
+                                                                                       var ap = this.get('/LeftPanel.model').activePath
+                                                                                       print("EDITED? "  + ap + " - p:" + p0 + " t:" + p0);
+                                                                                        this.get('/LeftPanel.model').changed(p0, true);
+                                                                                        this.get('/LeftPanel.model').activePath = false;
+                                                                                        this.el.editable = false;
+                                                                                },
+                                                                                editing_started : function (self, editable, path) {
+                                                                                   this.get('/LeftPanel').editing  = true;
+                                                                                       //  console.log('editing started');
+                                                                                       // r.has_entry = false;
+                                                                                
+                                                                                    this.el.editable = false; // make sure it's not editor...
+                                                                                   
+                                                                                }
+                                                                            },
+                                                                            editable : false,
+                                                                            pack : "pack_start",
+                                                                            text_column : 0,
+                                                                            has_entry : true,
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                               this.el.model = new Gtk.ListStore();
+                                                                                this.el.model.set_column_types ( 1, [
+                                                                                    GObject.TYPE_STRING  // 0 real key
+                                                                                  ]);
+                                                                            }
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Menu,
+                                                            pack : false,
+                                                            id : "LeftPanelPopup",
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.MenuItem,
+                                                                    pack : "append",
+                                                                    label : "Delete",
+                                                                    listeners : {
+                                                                        activate : function (self) {
+                                                                               this.get('/LeftPanel.model').deleteSelected();
+                                                                        }
+                                                                    }
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.MenuItem,
+                                                                    pack : "append",
+                                                                    label : "Edit",
+                                                                    listeners : {
+                                                                        activate : function (self) {
+                                                                               this.get('/LeftPanel.model').startEditing(false, 0);
+                                                                        }
+                                                                    }
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    xtype: Gtk.ScrolledWindow,
+                                    pack : "pack_end,false,true,0",
+                                    id : "MidPropTree",
+                                    shadow_type : Gtk.ShadowType.IN,
+                                    init : function() {
+                                        XObject.prototype.init.call(this);
+                                           XObject.prototype.init.call(this); 
+                                        this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC)
+                                        this.el.set_size_request ( 150, -1 );
+                                        this.shown = true;
+                                    },
+                                    activeElement : false,
+                                    hideWin : function() {
+                                         
+                                        if (!this.shown) {
+                                            return;
+                                        }
+                                        
+                                        
+                                        if (this.get('/Window.left').el.position < 160) {
+                                            return;
+                                        }
+                                        this.get('/Window.left').el.position = this.get('/Window.left').el.position  - 150;
+                                            
+                                        this.el.hide();
+                                        this.shown = false;
+                                    },
+                                    items : [
+                                        {
+                                            xtype: Gtk.TreeView,
+                                            listeners : {
+                                                cursor_changed : function (self) {
+                                                       var iter = new Gtk.TreeIter();
+                                                                        
+                                                                        //console.log('changed');
+                                                        var m = this.get('model');
+                                                       if (!this.selection){
+                                                               this.selection = this.el.get_selection();
+                                                       }
+                                                
+                                                        var s = this.selection;
+                                                        if (!s.get_selected(m.el, iter)) {
+                                                               return; 
+                                                       }
+                                                        var tp = m.el.get_path(iter).to_string();
+                                                        
+                                                        
+                                                        // var val = "";
+                                                        
+                                                        var key = m.getValue(tp, 0);
+                                                        
+                                                        var type = m.getValue(tp, 1);
+                                                        var skel = m.getValue(tp, 3);
+                                                        var etype = m.getValue(tp, 5);
+                                                        
+                                                        
+                                                        this.get('/MidPropTree').hideWin();
+                                                
+                                                        if (type.toLowerCase() == 'function') {
+                                                            
+                                                            if (etype != 'events') {
+                                                                key = '|' + key;
+                                                            }
+                                                            
+                                                            this.get('/LeftPanel.model').add({
+                                                                key :  key, 
+                                                                type : type,
+                                                                val  : skel,
+                                                                etype : etype
+                                                            })  
+                                                            return;
+                                                        }
+                                                        // has dot in name, and is boolean???? this does not make sense..
+                                                        //if (type.indexOf('.') > -1 ||  type.toLowerCase() == 'boolean') {
+                                                        //     key = '|' + key;
+                                                       // }
+                                                        
+                                                        this.get('/LeftPanel.model').add( {
+                                                            key : key, 
+                                                            type : type,
+                                                            //skel  : skel,
+                                                            etype : etype
+                                                           }) //, 
+                                                }
+                                            },
+                                            pack : "add",
+                                            tooltip_column : 2,
+                                            enable_tree_lines : true,
+                                            headers_visible : false,
+                                            init : function() {
+                                               XObject.prototype.init.call(this); 
+                                                                
+                                                   var description = new Pango.FontDescription.c_new();
+                                                 description.set_size(8000);
+                                                this.el.modify_font(description);     
+                                                                
+                                                //this.selection = this.el.get_selection();
+                                                // this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                             
+                                            
+                                                
+                                              
+                                                
+                                            },
+                                            items : [
+                                                {
+                                                    xtype: Gtk.ListStore,
+                                                    id : "model",
+                                                    pack : "set_model",
+                                                    getValue : function(treepath, col)
+                                                    {
+                                                        var tp = new Gtk.TreePath.from_string (treepath);
+                                                        var iter = new Gtk.TreeIter();
+                                                        this.el.get_iter (iter, tp);
+                                                        var value = new GObject.Value('');
+                                                        this.el.get_value(iter, col, value);
+                                                        return value.value;
+                                                        
+                                                    },
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_column_types ( 6, [
+                                                            GObject.TYPE_STRING,  // real key
+                                                             GObject.TYPE_STRING, // real type
+                                                             GObject.TYPE_STRING, // docs ?
+                                                             GObject.TYPE_STRING, // visable desc
+                                                             GObject.TYPE_STRING, // function desc
+                                                             GObject.TYPE_STRING // element type (event|prop)
+                                                            
+                                                        ] );
+                                                    },
+                                                    showData : function(type) {
+                                                        this.el.clear();
+                                                                if (!this.get('/MidPropTree').activeElement || !type) {
+                                                                    return; // no active element
+                                                                }
+                                                    
+                                                                var fullpath = this.get('/LeftTree.model').file.guessName(this.get('/MidPropTree').activeElement);
+                                                                var palete = this.get('/LeftTree').getPaleteProvider();
+                                                                
+                                                                 
+                                                                
+                                                                Seed.print('Showing right?');
+                                                                if (!this.get('/MidPropTree').shown) {
+                                                    
+                                                                    this.get('/Window.left').el.position = this.get('/Window.left').el.position  + 150;
+                                                                    this.get('/MidPropTree').el.show();
+                                                                    this.get('/MidPropTree').shown = true;
+                                                                }
+                                                                
+                                                                var elementList = palete.getPropertiesFor(fullpath, type).sort(function(a,b) { 
+                                                                    return a.name >  b.name ? 1 : -1;
+                                                                });
+                                                                print ("GOT " + elementList.length + " items for " + fullpath + "|" + type);
+                                                               // console.dump(elementList);
+                                                               
+                                                                
+                                                                var iter = new Gtk.TreeIter();
+                                                                for(var i =0 ; i < elementList.length; i++) {
+                                                                    var p=elementList[i];
+                                                                    this.el.append(iter);
+                                                                  //  console.log( '<b>' + p.name +'</b> ['+p.type+']');
+                                                                        //GObject.TYPE_STRING,  // real key
+                                                                        // GObject.TYPE_STRING, // real type
+                                                                        // GObject.TYPE_STRING, // docs ?
+                                                                        // GObject.TYPE_STRING // func def?
+                                                                        
+                                                                    
+                                                                    this.el.set_value(iter, 0, p.name);
+                                                                    this.el.set_value(iter, 1, p.type);
+                                                                    this.el.set_value(iter, 2, '<span size="small"><b>' + p.name +'</b> ['+p.type+']</span>' + "\n" + p.desc);
+                                                                    this.el.set_value(iter, 3, p.sig ? p.sig  : '');
+                                                                    this.el.set_value(iter, 4, '<span size="small"><b>' + p.name +'</b> ['+p.type+']</span>');
+                                                                    this.el.set_value(iter, 5, type);
+                                                                    
+                                                                }
+                                                                                 
+                                                    }
+                                                },
+                                                {
+                                                    xtype: Gtk.TreeViewColumn,
+                                                    init : function() {
+                                                        this.el = new Gtk.TreeViewColumn();
+                                                        this.parent.el.append_column(this.el);
+                                                        
+                                                        XObject.prototype.init.call(this);
+                                                        this.el.add_attribute(this.items[0].el , 'markup', 4  );
+                                                    },
+                                                    pack : false,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.CellRendererText,
+                                                            pack : "pack_start,true"
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        },
+                        {
+                            xtype: Gtk.HBox,
+                            pack : "add",
+                            items : [
+                                {
+                                    xtype: Gtk.VPaned,
+                                    pack : "add",
+                                    position : 300,
+                                    items : [
+                                        {
+                                            xtype: Gtk.VBox,
+                                            pack : "add",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.Notebook,
+                                                    pack : "pack_start,true,true",
+                                                    id : "view-help-nb",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Preview" }));
+                                                        this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : "Help" }));
+                                                    },
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Notebook,
+                                                            id : "view-notebook",
+                                                            pack : "add",
+                                                            tab_border : 0,
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                                this.el.set_current_page(0);
+                                                                //print("SET LABEL?")
+                                                                this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Roo View" }));
+                                                                this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : "Gtk View" }));
+                                                            },
+                                                            show_tabs : false,
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.VBox,
+                                                                    id : "RightBrowser",
+                                                                    pack : "add",
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.HBox,
+                                                                            pack : "pack_start,false,true,0",
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.Button,
+                                                                                    listeners : {
+                                                                                        clicked : function (self) {
+                                                                                          this.get('/RightBrowser.view').renderJS(null,true);
+                                                                                        }
+                                                                                    },
+                                                                                    label : "Redraw",
+                                                                                    pack : "pack_start,false,false,0"
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.CheckButton,
+                                                                                    listeners : {
+                                                                                        toggled : function (self, state) {
+                                                                                            this.el.set_label(this.el.active  ? "Auto Redraw On" : "Auto Redraw Off");
+                                                                                        }
+                                                                                    },
+                                                                                    active : true,
+                                                                                    id : "AutoRedraw",
+                                                                                    label : "Auto Redraw On",
+                                                                                    pack : "pack_start,false,false,0"
+                                                                                },
+                                                                                {
+                                                                                    xtype: Gtk.Button,
+                                                                                    listeners : {
+                                                                                        clicked : function (self) {
+                                                                                          this.get('/RightBrowser.view').redraws = 99;
+                                                                                          this.get('/RightBrowser.view').renderJS(null,true);
+                                                                                        }
+                                                                                    },
+                                                                                    label : "Full Redraw",
+                                                                                    pack : "pack_start,false,false,0"
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.ScrolledWindow,
+                                                                            pack : "add",
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                                this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                                            },
+                                                                            shadow_type : Gtk.ShadowType.IN,
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: WebKit.WebView,
+                                                                                    listeners : {
+                                                                                        load_finished : function (self, object) {
+                                                                                            print("load finished");
+                                                                                        //    print("load_finished"); return;
+                                                                                               // if (this.ready) { // dont do it twice!
+                                                                                                //   return; 
+                                                                                               //}
+                                                                                               if (!this.inspectorShown) {
+                                                                                                   this.el.get_inspector().show();
+                                                                                                   this.inspectorShown = true;
+                                                                                               }
+                                                                                        
+                                                                                               this.ready = true;
+                                                                                               
+                                                                                                if (this.pendingRedraw) {
+                                                                                                    this.pendingRedraw = false;
+                                                                                                    this.refreshRequired  = true;
+                                                                                                }
+                                                                                                //var js = this.get('/LeftTree.model').toJS();
+                                                                                                //if (js && js[0]) {
+                                                                                               //    this.renderJS(js[0]);
+                                                                                               //}
+                                                                                        
+                                                                                        },
+                                                                                        script_alert : function (self, object, p0) {
+                                                                                            //         print(p0);
+                                                                                                return false;
+                                                                                                return true; // do not display anything...
+                                                                                        },
+                                                                                        console_message : function (self, object, p0, p1) {
+                                                                                            print(object);
+                                                                                           //  console.log(object);
+                                                                                           
+                                                                                        
+                                                                                            if (object.match(/variable/) && object.match(/Builder/)) {
+                                                                                                print("got builder missing message");
+                                                                                                this.refreshRequired = true;
+                                                                                                this.lastRedraw = 0;
+                                                                                                this.runRefresh();
+                                                                                                return true;
+                                                                                            }
+                                                                                            
+                                                                                           
+                                                                                                if (!object.match(/^\{/)) {
+                                                                                                
+                                                                                                    //this.get('/Terminal').feed(object);
+                                                                                                    return true; // do not handle!!! -> later maybe in console..
+                                                                                                }
+                                                                                                
+                                                                                                
+                                                                                                
+                                                                                                
+                                                                                               // console.log(object);
+                                                                                                var val =  JSON.parse(object);
+                                                                                        
+                                                                                                if (typeof(val['hover-node']) != 'undefined') {
+                                                                                                    this.activeNode = val['hover-node'];
+                                                                                                    console.log('active node: ' + this.activeNode);
+                                                                                                    return true;
+                                                                                                }
+                                                                                        
+                                                                                                 var ret = false;
+                                                                                                 if (typeof(val['id']) != 'undefined') {
+                                                                                                   // this.activeNode = val['id'];
+                                                                                                    var tg = this.get('/LeftTree.model').findDropNode(val['id'], true); 
+                                                                                                    if (!tg || typeof(tg[0]) == 'undefined') {
+                                                                                                        return false;
+                                                                                                    }
+                                                                                                    print("SELECT node " + tg[0]);
+                                                                                                    
+                                                                                                    this.get('/LeftTree.view').selectNode(tg[0]);
+                                                                                                    ret  = true;
+                                                                                                    
+                                                                                                } 
+                                                                                                if (ret && typeof(val['set']) != 'undefined') {
+                                                                                                   this.get('/LeftPanel.model').add({
+                                                                                                        key : val['set'],
+                                                                                                        val : val['value']
+                                                                                                    });
+                                                                                                    //console.log('active node: ' + this.activeNode);
+                                                                                                    
+                                                                                                }
+                                                                                                //Seed.print('a:'+a);
+                                                                                                //Seed.print('b:'+b);
+                                                                                                //Seed.print('c:'+c);
+                                                                                                return ret;
+                                                                                        },
+                                                                                        drag_motion : function (w, ctx,  x,   y,   time, ud) {
+                                                                                           // console.log('DRAG MOTION'); 
+                                                                                                // status:
+                                                                                                // if lastCurrentNode == this.currentNode.. -- don't change anything..
+                                                                                                this.targetData = [];
+                                                                                                this.el.execute_script("Builder.overPos(" + x +','+ y + ");");
+                                                                                                
+                                                                                                // A) find out from drag all the places that node could be dropped.
+                                                                                                var src = Gtk.drag_get_source_widget(ctx);
+                                                                                                if (!src.dropList) {
+                                                                                                    Gdk.drag_status(ctx, 0, time);
+                                                                                                    return true;
+                                                                                                }
+                                                                                                // b) get what we are over.. (from activeNode)
+                                                                                                // tree is empty.. - list should be correct..
+                                                                                                if (!this.get('/LeftTree.model').currentTree) {
+                                                                                                    Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                    return true;
+                                                                                                    
+                                                                                                }
+                                                                                                // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)
+                                                                                                
+                                                                                                var tg = this.get('/LeftTree.model').findDropNode(this.activeNode, src.dropList);
+                                                                                                console.dump(tg);
+                                                                                                if (!tg.length) {
+                                                                                                    Gdk.drag_status(ctx, 0,time);
+                                                                                                    this.get('/LeftTree.view').highlight(false);
+                                                                                                    return true;
+                                                                                                }
+                                                                                                 
+                                                                                                // if we have a target..
+                                                                                                // -> highlight it! (in browser)
+                                                                                                // -> highlight it! (in tree)
+                                                                                                
+                                                                                                Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                this.get('/LeftTree.view').highlight(tg);
+                                                                                                this.targetData = tg;
+                                                                                                // for tree we should handle this...
+                                                                                                return true;
+                                                                                        },
+                                                                                        drag_drop : function (w, ctx, x, y,time, ud) {
+                                                                                               print("TARGET: drag-drop");
+                                                                                                var is_valid_drop_site = true;
+                                                                                                
+                                                                                                 
+                                                                                                Gtk.drag_get_data
+                                                                                                (
+                                                                                                        w,         /* will receive 'drag-data-received' signal */
+                                                                                                        ctx,        /* represents the current state of the DnD */
+                                                                                                        this.get('/Window').atoms["STRING"],    /* the target type we want */
+                                                                                                        time            /* time stamp */
+                                                                                                );
+                                                                                                                
+                                                                                                                
+                                                                                                                /* No target offered by source => error */
+                                                                                                               
+                                                                                        
+                                                                                               return  is_valid_drop_site;
+                                                                                        },
+                                                                                        drag_data_received : function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) 
+                                                                                            {
+                                                                                                print("Browser: drag-data-received");
+                                                                                                var delete_selection_data = false;
+                                                                                                vardnd_success = false;
+                                                                                                /* Deal with what we are given from source */
+                                                                                                if( sel_data && sel_data.length ) {
+                                                                                                    
+                                                                                                    if (ctx.action == Gdk.DragAction.ASK)  {
+                                                                                                        /* Ask the user to move or copy, then set the ctx action. */
+                                                                                                    }
+                                                                                        
+                                                                                                    if (ctx.action == Gdk.DragAction.MOVE) {
+                                                                                                        delete_selection_data = true;
+                                                                                                    }
+                                                                                                    var source = Gtk.drag_get_source_widget(ctx);
+                                                                                        
+                                                                                                    print("Browser: source.DRAGDATA? " + source.dragData);
+                                                                                                    if (this.targetData) {
+                                                                                                        print(this.targetData);
+                                                                                                        this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);
+                                                                                                    }
+                                                                                                    
+                                                                                                    
+                                                                                                    
+                                                                                                    dnd_success = true;
+                                                                                        
+                                                                                                }
+                                                                                        
+                                                                                                if (dnd_success == false)
+                                                                                                {
+                                                                                                        Seed.print ("DnD data transfer failed!\n");
+                                                                                                }
+                                                                                                
+                                                                                                Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
+                                                                                                return true;
+                                                                                            },
+                                                                                        create_web_view : function (self, object) {
+                                                                                          print("CREATE WEB VIEW");
+                                                                                           return null; //new WebKit.WebView();
+                                                                                        }
+                                                                                    },
+                                                                                    id : "view",
+                                                                                    pack : "add",
+                                                                                    redraws : 0,
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                        // this may not work!?
+                                                                                        var settings =  this.el.get_settings();
+                                                                                        settings.enable_developer_extras = true;
+                                                                                        
+                                                                                        // this was an attempt to change the url perms.. did not work..
+                                                                                        // settings.enable_file_access_from_file_uris = true;
+                                                                                        // settings.enable_offline_web_application_cache - true;
+                                                                                        // settings.enable_universal_access_from_file_uris = true;
+                                                                                        var _this = this;
+                                                                                         
+                                                                                         // init inspector..
+                                                                                        this.el.get_inspector().signal.inspect_web_view.connect(function(wi, pg) {
+                                                                                             _this.get('/BottomPane.inspector').el.show();
+                                                                                             return _this.get('/BottomPane.inspector').el;
+                                                                                        
+                                                                                        });
+                                                                                         
+                                                                                         // FIXME - base url of script..
+                                                                                         // we need it so some of the database features work.
+                                                                                        this.el.load_html_string( "Render not ready" , 
+                                                                                                //fixme - should be a config option!
+                                                                                                // or should we catch stuff and fix it up..
+                                                                                                'http://localhost/app.Builder/'
+                                                                                        );
+                                                                                            
+                                                                                            
+                                                                                       //this.el.open('file:///' + __script_path__ + '/../builder.html');
+                                                                                                              
+                                                                                        Gtk.drag_dest_set
+                                                                                        (
+                                                                                                this.el,              /* widget that will accept a drop */
+                                                                                                Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,
+                                                                                                null,            /* lists of target to support */
+                                                                                                0,              /* size of list */
+                                                                                                Gdk.DragAction.COPY         /* what to do with data after dropped */
+                                                                                        );
+                                                                                                                
+                                                                                       // print("RB: TARGETS : " + LeftTree.atoms["STRING"]);
+                                                                                        Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);
+                                                                                        
+                                                                                        GLib.timeout_add_seconds(0, 1, function() {
+                                                                                            //    print("run refresh?");
+                                                                                             _this.runRefresh(); 
+                                                                                             return true;
+                                                                                         });
+                                                                                        
+                                                                                        
+                                                                                    },
+                                                                                    renderJS : function(data, force) {
+                                                                                    
+                                                                                        // this is the public redraw call..
+                                                                                        // we refresh in a loop privately..
+                                                                                        var autodraw = this.get('/RightBrowser.AutoRedraw').el.active;
+                                                                                        if (!autodraw && !force) {
+                                                                                            print("Skipping redraw - no force, and autodraw off");
+                                                                                            return;
+                                                                                        }
+                                                                                        this.refreshRequired  = true;
+                                                                                    },
+                                                                                    runRefresh : function() 
+                                                                                    {
+                                                                                        // this is run every 2 seconds from the init..
+                                                                                    
+                                                                                      
+                                                                                        
+                                                                                        if (!this.refreshRequired) {
+                                                                                           // print("no refresh required");
+                                                                                            return;
+                                                                                        }
+                                                                                    
+                                                                                        if (this.lastRedraw) {
+                                                                                           // do not redraw if last redraw was less that 5 seconds ago.
+                                                                                           if (((new Date()) -  this.lastRedraw) < 5000) {
+                                                                                                return;
+                                                                                            }
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        
+                                                                                        
+                                                                                         if (!this.get('/Window.LeftTree').getActiveFile()) {
+                                                                                            return;
+                                                                                         }
+                                                                                         this.refreshRequired = false;
+                                                                                       //  print("HTML RENDERING");
+                                                                                         
+                                                                                         this.get('/BottomPane').el.show();
+                                                                                         this.get('/BottomPane').el.set_current_page(2);// webkit inspector
+                                                                                    
+                                                                                        
+                                                                                        var js = this.get('/LeftTree.model').toJS();
+                                                                                        if (!js || !js.length) {
+                                                                                            print("no data");
+                                                                                            return;
+                                                                                        }
+                                                                                        var  data = js[0];
+                                                                                        this.redraws++;
+                                                                                        
+                                                                                         var project = this.get('/Window.LeftTree').getActiveFile().project;
+                                                                                         //print (project.fn);
+                                                                                         // set it to non-empty.
+                                                                                         project.runhtml  =     project.runhtml  || '';
+                                                                                         project.runhtml  = project.runhtml.length ?  project.runhtml : '<script type="text/javascript"></script>'; 
+                                                                                        
+                                                                                    
+                                                                                         this.runhtml  = this.runhtml || '';
+                                                                                        
+                                                                                         if ((project.runhtml != this.runhtml) || (this.redraws > 10)) {
+                                                                                            // then we need to reload the browser using
+                                                                                            // load_html_string..
+                                                                                            
+                                                                                            // then trigger a redraw once it's loaded..
+                                                                                            this.pendingRedraw = true;
+                                                                                             var runhtml = '<script type="text/javascript">' + "\n" ;
+                                                                                             runhtml +=imports.File.File.read(__script_path__ + '/../builder.html.js') + "\n";
+                                                                                             runhtml += '</script>'+ "\n" ;
+                                                                                            
+                                                                                            this.runhtml = project.runhtml;
+                                                                                            // need to modify paths
+                                                                                            
+                                                                                            
+                                                                                            
+                                                                                            var html = imports.File.File.read(__script_path__ + '/../builder.html');
+                                                                                            html = html.replace('</head>', runhtml + this.runhtml + '</head>');
+                                                                                            print("LOAD HTML " + html);
+                                                                                            this.el.load_html_string( html , 
+                                                                                                //fixme - should be a config option!
+                                                                                                'http://localhost/app.Builder/'
+                                                                                            );
+                                                                                            this.redraws = 0;
+                                                                                            // should trigger load_finished! - which in truns shoudl set refresh Required;
+                                                                                            return;
+                                                                                        
+                                                                                        }
+                                                                                        
+                                                                                        
+                                                                                        this.renderedData = data;
+                                                                                        var str = JSON.stringify(data) ;
+                                                                                        
+                                                                                        if (!this.ready) {
+                                                                                            console.log('not loaded yet');
+                                                                                        }
+                                                                                        this.lastRedraw = new Date();
+                                                                                    
+                                                                                        this.el.execute_script("Builder.render(" + JSON.stringify(data) + ");");
+                                                                                         print( "before render" +    this.lastRedraw);
+                                                                                        print( "after render" +    (new Date()));
+                                                                                        
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.VBox,
+                                                                    id : "RightGtkView",
+                                                                    pack : "add",
+                                                                    redraw : function() {
+                                                                       this.highlightWidget = false;
+                                                                        print("REDRAW CALLED");
+                                                                        this.activePath = this.get('/LeftTree').getActivePath();
+                                                                        if (this.renderedEl) {
+                                                                          print("QUEUE DRAW CALLING");
+                                                                          this.renderedEl.queue_draw();
+                                                                       }
+                                                                    },
+                                                                    renderJS : function(data, withDebug)
+                                                                    {
+                                                                          this.highlightWidget = false;
+                                                                       
+                                                                        this.withDebug = false;
+                                                                        while (this.get('view').el.get_children().length) {
+                                                                            var c = this.get('view').el.get_children()[0];
+                                                                            this.get('view').el.remove(c);        
+                                                                            c.destroy();
+                                                                        }
+                                                                         if (!data) {
+                                                                             return; 
+                                                                        }
+                                                                        
+                                                                        var tree =  this.get('/LeftTree.model').toJS(false,true)[0];
+                                                                        // in theory tree is actually window..  
+                                                                       try {
+                                                                      
+                                                                            this.renderedEl = this.viewAdd(tree.items[0], this.get('view').el);
+                                                                          
+                                                                      } catch (e) {
+                                                                         print(e.message);
+                                                                        return;
+                                                                      }
+                                                                        this.get('view').el.set_size_request(
+                                                                            tree.default_width * 1 || 400, tree.default_height * 1 || 400
+                                                                        ) ;
+                                                                        if (this.renderedEl) {
+                                                                            this.renderedEl.set_size_request(
+                                                                                tree.default_width || 600,
+                                                                                tree.default_height || 400
+                                                                            );
+                                                                        }
+                                                                        this.get('view').el.show_all();
+                                                                        
+                                                                        
+                                                                        
+                                                                    },
+                                                                    showInWindow : function() {
+                                                                      print("GET PROEJCT");
+                                                                       var pr = this.get('/LeftProjectTree').getActiveProject();
+                                                                      
+                                                                       console.log(pr.paths);
+                                                                        return;
+                                                                    /*
+                                                                         var src= this.buildJS(
+                                                                               this.get('/LeftTree.model').toJS()[0], 
+                                                                               true);
+                                                                          // show term?? 
+                                                                    
+                                                                    
+                                                                        //var x = new imports.sandbox.Context();
+                                                                        //x.add_globals();
+                                                                        //print(src);
+                                                                        try {
+                                                                            Seed.check_syntax('var e = ' + src);
+                                                                            //x.eval(src);
+                                                                        } catch( e) {
+                                                                            this.get('/Terminal').feed(e.message || e.toString() + "\n");
+                                                                            this.get('/Terminal').feed(console._dump(e)+"\n");
+                                                                            if (e.line) {
+                                                                                var lines = src.split("\n");
+                                                                                var start = Math.max(0, e.line - 10);
+                                                                                var end = Math.min(lines.length, e.line + 10);
+                                                                                for (var i =start ; i < end; i++) {
+                                                                                    if (i == e.line) {
+                                                                                        this.get('/Terminal').feed(">>>>>" + lines[i] + "\n");
+                                                                                        continue;
+                                                                                    }
+                                                                                    this.get('/Terminal').feed(lines[i] + "\n");
+                                                                                }
+                                                                                
+                                                                            }
+                                                                            
+                                                                            return;
+                                                                        }
+                                                                         this.get('/BottomPane').el.set_current_page(1);
+                                                                        this.get('/Terminal').el.fork_command( null , [], [], "/tmp", false,false,false); 
+                                                                        var cmd = "/usr/bin/seed /tmp/BuilderGtkView.js\n";
+                                                                        this.get('/Terminal').el.feed_child(cmd, cmd.length);
+                                                                         /*
+                                                                        var _top = x.get_global_object()._top;
+                                                                        
+                                                                        _top.el.set_screen(Gdk.Screen.get_default()); // just in case..
+                                                                        _top.el.show_all();
+                                                                        if (_top.el.popup) {
+                                                                            _top.el.popup(null, null, null, null, 3, null);
+                                                                        }
+                                                                    */
+                                                                    },
+                                                                    viewAdd : function(item, par)
+                                                                            {
+                                                                        // does something similar to xobject..
+                                                                        item.pack = (typeof(item.pack) == 'undefined') ?  'add' : item.pack;
+                                                                        
+                                                                        if (item.pack===false || item.pack === 'false') {  // no ;
+                                                                            return;
+                                                                        }
+                                                                        print("CREATE: " + item['|xns'] + '.' + item['xtype']);
+                                                                        var type = item['|xns'] + '.' + item['xtype'];
+                                                                        
+                                                                        if (item['|xns'] == 'GtkClutter') { // we can not add this yet!
+                                                                            return false;
+                                                                        }
+                                                                        var ns = imports.gi[item['|xns']];
+                                                                        var ctr = ns[item['xtype']];
+                                                                        var ctr_args = { };
+                                                                        for(var k in item) {
+                                                                            var kv = item[k];
+                                                                            if (typeof(kv) == 'object' || typeof(kv) == 'function') {
+                                                                                continue;
+                                                                            }
+                                                                            if ( 
+                                                                                k == 'pack' ||
+                                                                                k == 'items' ||
+                                                                                k == 'id' ||
+                                                                                k == 'xtype' ||
+                                                                                k == 'xdebug' ||
+                                                                                k == 'xns' ||
+                                                                                k == '|xns'
+                                                                            ) {
+                                                                                continue;
+                                                                            }
+                                                                    
+                                                                       if (k[0] == '|' && typeof(kv) == 'string') {
+                                                                    
+                                                                               if (kv.match(new RegExp('function'))) {
+                                                                                       continue;
+                                                                                    }
+                                                                                print("WASL " + k + '=' + kv);
+                                                                               try {
+                                                                                       eval( 'kv = ' + kv);
+                                                                               } catch(e) {    continue; }
+                                                                                    
+                                                                               k = k.substring(1);
+                                                                                 // print(k + '=' + kv);
+                                                                       }
+                                                                            if (k[0] == '|') { // should be boolean or number..
+                                                                               k = k.substring(1);
+                                                                               //print(k + '=' + kv);
+                                                                            }
+                                                                             
+                                                                       if (k == 'show_tabs') { // force tab showing for notebooks.
+                                                                               kv = true;
+                                                                            }
+                                                                            print(k + '=' + typeof(kv) + " : " + kv);
+                                                                            ctr_args[k] = kv;
+                                                                            
+                                                                        } 
+                                                                        
+                                                                        
+                                                                        var el = new ctr(ctr_args);
+                                                                        
+                                                                        print("PACK" + item.pack);
+                                                                        //console.dump(item.pack);
+                                                                        
+                                                                        
+                                                                        
+                                                                        
+                                                                        var args = [];
+                                                                        var pack_m  = false;
+                                                                        if (typeof(item.pack) == 'string') {
+                                                                             
+                                                                            item.pack.split(',').forEach(function(e, i) {
+                                                                                
+                                                                                if (e == 'false') { args.push( false); return; }
+                                                                                if (e == 'true') {  args.push( true);  return; }
+                                                                                if (!isNaN(parseInt(e))) { args.push( parseInt(e)); return; }
+                                                                                args.push(e);
+                                                                            });
+                                                                            //print(args.join(","));
+                                                                            
+                                                                            pack_m = args.shift();
+                                                                        } else {
+                                                                            pack_m = item.pack.shift();
+                                                                            args = item.pack;
+                                                                        }
+                                                                        
+                                                                        // handle error.
+                                                                        if (pack_m && typeof(par[pack_m]) == 'undefined') {
+                                                                            throw {
+                                                                                    name: "ArgumentError", 
+                                                                                    message : 'pack method not available : ' + par.id + " : " + par + '.' +  pack_m +
+                                                                                            "ADDING : " + item.id + " " +  el
+                                                                                        
+                                                                           };
+                                                                    
+                                                                            return;
+                                                                        }
+                                                                        
+                                                                        console.dump(args);
+                                                                        args.unshift(el);
+                                                                        //if (XObject.debug) print(pack_m + '[' + args.join(',') +']');
+                                                                        //Seed.print('args: ' + args.length);
+                                                                        if (pack_m) {
+                                                                            par[pack_m].apply(par, args);
+                                                                        }
+                                                                        
+                                                                        var _this = this;
+                                                                        item.items = item.items || [];
+                                                                        item.items.forEach(function(ch,n) {
+                                                                    
+                                                                              print ("type:" + type);
+                                                                              
+                                                                               print ("ch.pack:" + ch.pack);
+                                                                             if (type == 'Gtk.Table' && ch.pack == 'add') {
+                                                                                var c = n % item.n_columns;
+                                                                                var r = Math.floor(n/item.n_columns);
+                                                                                ch.pack = [ 'attach', c, c+1, r, r+1, 
+                                                                                         typeof(ch.x_options) == 'undefined' ?  5 : ch.x_options,
+                                                                                            typeof(ch.y_options) == 'undefined' ?  5 : ch.y_options,
+                                                                                            typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding,
+                                                                                            typeof(ch.x_padding) == 'undefined' ?  0 : ch.x_padding
+                                                                                ].join(',');
+                                                                            }
+                                                                        
+                                                                            _this.viewAdd(ch, el);
+                                                                        });
+                                                                        
+                                                                        
+                                                                        
+                                                                        // add the signal handlers.
+                                                                        // is it a widget!?!!?
+                                                                       
+                                                                        
+                                                                        try {
+                                                                             
+                                                                            
+                                                                            el.signal.expose_event.connect(XObject.createDelegate(this.widgetExposeEvent, this, [ item  ], true));
+                                                                            el.signal.drag_motion.connect(XObject.createDelegate(this.widgetDragMotionEvent, this,[ item  ], true));
+                                                                            el.signal.drag_drop.connect(XObject.createDelegate(this.widgetDragDropEvent, this, [ item  ], true));
+                                                                            el.signal.button_press_event.connect(XObject.createDelegate(this.widgetPressEvent, this, [ item  ], true ));
+                                                                      el.signal.button_release_event.connect(XObject.createDelegate(this.widgetReleaseEvent, this, [ item  ], true ));
+                                                                        } catch(e) {
+                                                                            // ignore!
+                                                                           }
+                                                                        
+                                                                        
+                                                                        
+                                                                        return el;
+                                                                        
+                                                                    },
+                                                                    widgetDragDropEvent : function() {
+                                                                          print("WIDGET DRAGDROP"); 
+                                                                                return true;
+                                                                    },
+                                                                    widgetDragMotionEvent : function() {
+                                                                         print("WIDGET DRAGMOTION"); 
+                                                                                return true;
+                                                                    },
+                                                                    widgetExposeEvent : function(w, evt, ud, item) {
+                                                                        var widget = w;
+                                                                         if (this.inRender) {
+                                                                             return false;
+                                                                         }
+                                                                         
+                                                                         if ( this.highlightWidget) {
+                                                                              this.inRender = true;
+                                                                              if (item.xtreepath.substring(0, this.activePath.length) == this.activePath) {
+                                                                                     Gdk.draw_rectangle(this.highlightWidget.window, this.gc, false, this.box.x , this.box.y, this.box.w, this.box.h);
+                                                                                }
+                                                                               this.inRender = false;
+                                                                               return false;
+                                                                         }
+                                                                         
+                                                                         
+                                                                         if (this.activePath != item.xtreepath) {
+                                                                            return false;
+                                                                         }
+                                                                         
+                                                                       //  print("HIGHLIGHT: " + item.xtreepath ); // draw highlight??
+                                                                         // work out the coords of the window..
+                                                                         if (!this.gc) {
+                                                                          var dr = widget.window;
+                                                                          this.gc = (new Gdk.GC.c_new(dr));
+                                                                          this.gc.set_rgb_fg_color(new Gdk.Color({ red: 0xFFFF, green: 0, blue : 0 }));
+                                                                          this.gc.set_line_attributes(4,  Gdk.LineStyle.SOLID, Gdk.CapStyle.ROUND , Gdk.JoinStyle.ROUND);
+                                                                        }
+                                                                    
+                                                                        
+                                                                         var r  = evt.expose.area;
+                                                                         // console.dump([r.x, r.y, r.width, r.height ] );
+                                                                         //return false;
+                                                                    //     print(widget.get_parent().toString().match(/GtkScrolledWindow/);
+                                                                         if (widget.get_parent().toString().match(/GtkScrolledWindow/)) { // eak
+                                                                             // happens with gtkscrollview embedded stuff..
+                                                                             var np =this.activePath.split(':');
+                                                                             np.pop();
+                                                                             this.activePath = np.join(':');
+                                                                             this.renderedEl.queue_draw();
+                                                                             return true;
+                                                                    
+                                                                            
+                                                                         }
+                                                                    
+                                                                           
+                                                                         
+                                                                         
+                                                                          this.box = {
+                                                                            x : r.x - 2,
+                                                                            y : r.y - 2,
+                                                                            w: r.width + 4,
+                                                                            h: r.height + 4
+                                                                          }; 
+                                                                          // let's draw it..
+                                                                          this.inRender = true;
+                                                                    
+                                                                          
+                                                                          this.highlightWidget = widget;
+                                                                        
+                                                                        
+                                                                     
+                                                                    
+                                                                        //  print("DRAW BOX");
+                                                                           //console.dump(this.box);
+                                                                          Gdk.draw_rectangle(widget.window, this.gc, false, this.box.x , this.box.y, this.box.w,this.box.h);
+                                                                                this.inRender = false;
+                                                                                return false;
+                                                                    },
+                                                                    widgetPressEvent : function(w,e,u,d) {
+                                                                         if (this.get('view').pressed) {
+                                                                            return false;
+                                                                         }
+                                                                    this.get('view').pressed = true;
+                                                                          print("WIDGET PRESS " + d.xtreepath );       
+                                                                              this.get('/LeftTree.view').selectNode(   d.xtreepath );        
+                                                                                return false;
+                                                                    },
+                                                                    widgetReleaseEvent : function() {
+                                                                        this.get('view').pressed = false;
+                                                                       return false;
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.HBox,
+                                                                            pack : "pack_start,false,true,0",
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.Button,
+                                                                                    pack : "pack_start,false,false,0",
+                                                                                    label : "Run The Application",
+                                                                                    listeners : {
+                                                                                        button_press_event : function (self, event) {
+                                                                                            // call render on left tree - with special option!?!
+                                                                                         
+                                                                                            //print("GET PROEJCT");
+                                                                                            var pr = this.get('/LeftProjectTree').getActiveProject();
+                                                                                          
+                                                                                            var dir = '';
+                                                                                            for (var i in pr.paths) { 
+                                                                                                dir = i;
+                                                                                                break;
+                                                                                            }
+                                                                                            var runner = GLib.path_get_dirname (__script_path__) + '/gtkrun.js'; 
+                                                                                            this.get('/Terminal').feed("RUN DIR:" + dir);
+                                                                                            
+                                                                                            this.get('/Terminal').el.fork_command( null , [], [], GLib.path_get_dirname (__script_path__) 
+                                                                                               , false,false,false); 
+                                                                                            var cmd = "/usr/bin/seed " + runner + " " + dir + "\n";
+                                                                                            this.get('/Terminal').el.feed_child(cmd, cmd.length);
+                                                                                            return false;
+                                                                                          
+                                                                                        
+                                                                                        }
+                                                                                    }
+                                                                                }
+                                                                            ]
+                                                                        },
+                                                                        {
+                                                                            xtype: Gtk.ScrolledWindow,
+                                                                            pack : "add",
+                                                                            id : "view-sw",
+                                                                            shadow_type : Gtk.ShadowType.IN,
+                                                                            init : function() {
+                                                                                XObject.prototype.init.call(this);
+                                                                             this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                                            },
+                                                                            items : [
+                                                                                {
+                                                                                    xtype: Gtk.EventBox,
+                                                                                    pack : "add_with_viewport",
+                                                                                    init : function() {
+                                                                                        XObject.prototype.init.call(this);
+                                                                                    this.el.modify_bg(Gtk.StateType.NORMAL, new Gdk.Color({
+                                                                                                red: 0x9F00, green: 0xB800 , blue : 0xA800
+                                                                                               }));
+                                                                                    },
+                                                                                    items : [
+                                                                                        {
+                                                                                            xtype: Gtk.Fixed,
+                                                                                            pack : "add",
+                                                                                            init : function() {
+                                                                                               XObject.prototype.init.call(this);
+                                                                                               //this.el.set_hadjustment(this.parent.el.get_hadjustment());
+                                                                                               //this.el.set_vadjustment(this.parent.el.get_vadjustment());
+                                                                                             
+                                                                                            },
+                                                                                            items : [
+                                                                                                {
+                                                                                                    xtype: Gtk.EventBox,
+                                                                                                    pack : "put,10,10",
+                                                                                                    init : function() {
+                                                                                                       //this.el =     new Gtk.Image.from_stock (Gtk.STOCK_HOME,  Gtk.IconSize.MENU);
+                                                                                                       XObject.prototype.init.call(this);
+                                                                                                    
+                                                                                                                Gtk.drag_dest_set
+                                                                                                                (
+                                                                                                                        this.el,              /* widget that will accept a drop */
+                                                                                                                        Gtk.DestDefaults.MOTION  | Gtk.DestDefaults.HIGHLIGHT,
+                                                                                                                        null,            /* lists of target to support */
+                                                                                                                        0,              /* size of list */
+                                                                                                                        Gdk.DragAction.COPY         /* what to do with data after dropped */
+                                                                                                                );
+                                                                                                                
+                                                                                                               // print("RB: TARGETS : " + LeftTree.atoms["STRING"]);
+                                                                                                                Gtk.drag_dest_set_target_list(this.el, this.get('/Window').targetList);
+                                                                                                    },
+                                                                                                    ready : false,
+                                                                                                    getActiveNode : function(x,y)
+                                                                                                    {
+                                                                                                       // workout what node is here..
+                                                                                                        return '0'; // top..
+                                                                                                    },
+                                                                                                    id : "view",
+                                                                                                    listeners : {
+                                                                                                        drag_motion : function (self, ctx, x, y, time) {
+                                                                                                            
+                                                                                                                        // A) find out from drag all the places that node could be dropped.
+                                                                                                                        var src = Gtk.drag_get_source_widget(ctx);
+                                                                                                                        if (!src.dropList) {
+                                                                                                                            Gdk.drag_status(ctx, 0, time);
+                                                                                                                            return true;
+                                                                                                                        }
+                                                                                                                        // b) get what we are over.. (from activeNode)
+                                                                                                                        // tree is empty.. - list should be correct..
+                                                                                                                        if (!this.get('/LeftTree.model').currentTree) {
+                                                                                                                            Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                                            return true;
+                                                                                                                            
+                                                                                                                        }
+                                                                                                                        // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)
+                                                                                                                        var activeNode = this.getActiveNode(x, y);
+                                                                                                                        
+                                                                                                                        
+                                                                                                                        var tg = this.get('/LeftTree.model').findDropNode(activeNode, src.dropList);
+                                                                                                                        console.dump(tg);
+                                                                                                                        if (!tg.length) {
+                                                                                                                            Gdk.drag_status(ctx, 0,time);
+                                                                                                                            this.get('/LeftTree.view').highlight(false);
+                                                                                                                            return true;
+                                                                                                                        }
+                                                                                                                         
+                                                                                                                        // if we have a target..
+                                                                                                                        // -> highlight it! (in browser)
+                                                                                                                        // -> highlight it! (in tree)
+                                                                                                                        
+                                                                                                                        Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
+                                                                                                                        this.get('/LeftTree.view').highlight(tg);
+                                                                                                                        this.targetData = tg;
+                                                                                                                        // for tree we should handle this...
+                                                                                                                        return true;
+                                                                                                        },
+                                                                                                        drag_drop : function (self,ctx, x, y, time) {
+                                                                                                               Seed.print("TARGET: drag-drop");
+                                                                                                                var is_valid_drop_site = true;
+                                                                                                                
+                                                                                                                 
+                                                                                                                Gtk.drag_get_data
+                                                                                                                (
+                                                                                                                        self,         /* will receive 'drag-data-received' signal */
+                                                                                                                        ctx,        /* represents the current state of the this.gDnD */
+                                                                                                                        this.get('/Window').atoms["STRING"],    /* the target type we want */
+                                                                                                                        time            /* time stamp */
+                                                                                                                );
+                                                                                                                
+                                                                                                                
+                                                                                                                /* No target offered by source => error */
+                                                                                                               
+                                                                                                        
+                                                                                                                return  is_valid_drop_site;
+                                                                                                          
+                                                                                                        },
+                                                                                                        drag_data_received : function (w, ctx,  x,  y, sel_data,  target_type,  time, ud) 
+                                                                                                            {
+                                                                                                                Seed.print("GtkView: drag-data-received");
+                                                                                                                var delete_selection_data = false;
+                                                                                                                var dnd_success = false;
+                                                                                                                /* Deal with what we are given from source */
+                                                                                                                if( sel_data && sel_data.length ) {
+                                                                                                                    
+                                                                                                                    if (ctx.action == Gdk.DragAction.ASK)  {
+                                                                                                                        /* Ask the user to move or copy, then set the ctx action. */
+                                                                                                                    }
+                                                                                                        
+                                                                                                                    if (ctx.action == Gdk.DragAction.MOVE) {
+                                                                                                                        delete_selection_data = true;
+                                                                                                                    }
+                                                                                                                    var source = Gtk.drag_get_source_widget(ctx);
+                                                                                                        
+                                                                                                                    Seed.print("Browser: source.DRAGDATA? " + source.dragData);
+                                                                                                                    if (this.targetData) {
+                                                                                                                        Seed.print(this.targetData);
+                                                                                                                        this.get('/LeftTree.model').dropNode(this.targetData,  source.dragData);
+                                                                                                                    }
+                                                                                                                    
+                                                                                                                    
+                                                                                                                    
+                                                                                                                    dnd_success = true;
+                                                                                                        
+                                                                                                                }
+                                                                                                        
+                                                                                                                if (dnd_success == false)
+                                                                                                                {
+                                                                                                                        Seed.print ("DnD data transfer failed!\n");
+                                                                                                                }
+                                                                                                                
+                                                                                                                Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
+                                                                                                                return true;
+                                                                                                            },
+                                                                                                        button_press_event : function (self, event) {
+                                                                                                          this.pressed = false;
+                                                                                                            return false;
+                                                                                                        }
+                                                                                                    }
+                                                                                                }
+                                                                                            ]
+                                                                                        }
+                                                                                    ]
+                                                                                }
+                                                                            ]
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        },
+                                                        {
+                                                            xtype: Gtk.ScrolledWindow,
+                                                            id : "Help",
+                                                            pack : "add",
+                                                            show : function() {
+                                                                
+                                                                var file = this.get('/LeftTree').getActiveFile();
+                                                                if (!file) {
+                                                                    return;
+                                                                }
+                                                                var activeEl = this.get('/LeftTree').getActiveElement();
+                                                                var xtype = file.guessName( activeEl )
+                                                                if (!xtype || !xtype.length) {
+                                                                    return;
+                                                                }
+                                                                //this.get('/Window.view-help-nb').el.set_current_page(1);
+                                                                
+                                                                // get the active element being edited.
+                                                                var helpurl = file.getHelpUrl(xtype);       
+                                                                
+                                                                // now load the help info in the page..
+                                                                this.get('help-view').el.open(helpurl);
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: WebKit.WebView,
+                                                                    pack : "add",
+                                                                    id : "help-view",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                       this.get('/Window.help-view').el.open(
+                                                                         "http://devel.akbkhome.com/seed/");
+                                                                    
+                                                                    },
+                                                                    zoom_level : 0.8
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            xtype: Gtk.Notebook,
+                                            id : "BottomPane",
+                                            pack : "add",
+                                            init : function() {
+                                                XObject.prototype.init.call(this);
+                                               //this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Code Editor" }));
+                                                       this.el.set_tab_label(this.items[0].el, new Gtk.Label({ label : "Console" }));
+                                                       this.el.set_tab_label(this.items[1].el, new Gtk.Label({ label : "Inspector" }));
+                                            },
+                                            items : [
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    pack : "add",
+                                                    items : [
+                                                        {
+                                                            xtype: Vte.Terminal,
+                                                            pack : "add",
+                                                            id : "Terminal",
+                                                            feed : function(istr) {
+                                                                var str = istr.replace(/\n/g, "\r\n") + "\r\n";
+                                                                // we should make ourselves visable!!!
+                                                                this.get('/BottomPane').el.show();
+                                                                this.get('/BottomPane').el.set_current_page(1);
+                                                            
+                                                                this.el.feed(str ,str.length);
+                                                            },
+                                                            scroll_on_output : true,
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                                this.el.set_size (80, 1000);
+                                                            },
+                                                            scrollback_lines : 1000
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    pack : "add",
+                                                    items : [
+                                                        {
+                                                            xtype: WebKit.WebView,
+                                                            id : "inspector",
+                                                            pack : "add"
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                },
+                                {
+                                    xtype: Gtk.VBox,
+                                    pack : "pack_start,false,false",
+                                    id : "RightPalete",
+                                    hide : function() {
+                                        
+                                          this.get('buttonbar').el.show();
+                                           this.get('viewbox').el.hide();
+                                        print("TRIED TO HIDE");
+                                    },
+                                    show : function() {
+                                        this.get('buttonbar').el.hide();
+                                        this.get('viewbox').el.show();
+                                       // this.get('model').expanded();
+                                                
+                                    },
+                                    provider : false,
+                                    items : [
+                                        {
+                                            xtype: Gtk.VBox,
+                                            pack : "add",
+                                            id : "buttonbar",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.Button,
+                                                    pack : "pack_start,false,true",
+                                                    listeners : {
+                                                        clicked : function (self) {
+                                                               this.get('/RightPalete').show();
+                                                        }
+                                                    },
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Image,
+                                                            pack : "add",
+                                                            stock : Gtk.STOCK_GOTO_FIRST,
+                                                            icon_size : Gtk.IconSize.MENU
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.Label,
+                                                    pack : "add",
+                                                    label : "Palete",
+                                                    angle : 270,
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                        this.el.add_events ( Gdk.EventMask.BUTTON_MOTION_MASK );
+                                                    },
+                                                    listeners : {
+                                                        enter_notify_event : function (self, event) {
+                                                            this.get('/RightPalete').show();
+                                                            return false;
+                                                        }
+                                                    }
+                                                }
+                                            ]
+                                        },
+                                        {
+                                            xtype: Gtk.VBox,
+                                            pack : "add",
+                                            id : "viewbox",
+                                            items : [
+                                                {
+                                                    xtype: Gtk.HBox,
+                                                    pack : "pack_start,false,true",
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.Label,
+                                                            pack : "add",
+                                                            label : "Palete"
+                                                        },
+                                                        {
+                                                            xtype: Gtk.Button,
+                                                            pack : "pack_start,false,true",
+                                                            listeners : {
+                                                                clicked : function (self) {
+                                                                       this.get('/RightPalete').hide();
+                                                                }
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.Image,
+                                                                    pack : "add",
+                                                                    stock : Gtk.STOCK_GOTO_LAST,
+                                                                    icon_size : Gtk.IconSize.MENU
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                },
+                                                {
+                                                    xtype: Gtk.ScrolledWindow,
+                                                    pack : "add",
+                                                    init : function() {
+                                                        XObject.prototype.init.call(this);
+                                                       this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+                                                        this.el.set_size_request(-1,200);
+                                                    },
+                                                    shadow_type : Gtk.ShadowType.IN,
+                                                    items : [
+                                                        {
+                                                            xtype: Gtk.TreeView,
+                                                            listeners : {
+                                                                drag_begin : function (self, ctx) {
+                                                                    // we could fill this in now...
+                                                                        Seed.print('SOURCE: drag-begin');
+                                                                        
+                                                                        
+                                                                        
+                                                                        var iter = new Gtk.TreeIter();
+                                                                        var s = this.selection;
+                                                                        s.get_selected(this.get('/RightPalete.model').el, iter);
+                                                                        var path = this.get('/RightPalete.model').el.get_path(iter);
+                                                                        
+                                                                        var pix = this.el.create_row_drag_icon ( path);
+                                                                            
+                                                                                
+                                                                        Gtk.drag_set_icon_pixmap (ctx,
+                                                                            pix.get_colormap(),
+                                                                            pix,
+                                                                            null,
+                                                                            -10,
+                                                                            -10);
+                                                                        
+                                                                        var value = new GObject.Value('');
+                                                                        this.get('/RightPalete.model').el.get_value(iter, 0, value);
+                                                                        if (!this.get('/RightPalete').provider) {
+                                                                            return false;
+                                                                        }
+                                                                        this.el.dropList = this.get('/RightPalete').provider.getDropList(value.value);
+                                                                        this.el.dragData = value.value;
+                                                                        
+                                                                        
+                                                                        
+                                                                        
+                                                                        return true;
+                                                                },
+                                                                drag_data_get : function (self, drag_context, selection_data, info, time) {
+                                                                       //Seed.print('Palete: drag-data-get: ' + target_type);
+                                                                        if (this.el.dragData && this.el.dragData.length ) {
+                                                                            selection_data.set_text(this.el.dragData ,this.el.dragData.length);
+                                                                        }
+                                                                        
+                                                                        
+                                                                        //this.el.dragData = "TEST from source widget";
+                                                                        
+                                                                        
+                                                                },
+                                                                drag_end : function (self, drag_context) {
+                                                                       Seed.print('SOURCE: drag-end');
+                                                                       this.el.dragData = false;
+                                                                       this.el.dropList = false;
+                                                                       this.get('/LeftTree.view').highlight(false);
+                                                                       return true;
+                                                                },
+                                                                button_press_event : function (self, event) {
+                                                                
+                                                                       if (!this.get('/Editor').save()) {
+                                                                           // popup!! - click handled.. 
+                                                                           return true;
+                                                                        }
+                                                                    return false;
+                                                                }
+                                                            },
+                                                            pack : "add",
+                                                            enable_tree_lines : true,
+                                                            headers_visible : false,
+                                                            init : function() {
+                                                                XObject.prototype.init.call(this);
+                                                              this.el.set_size_request(150,-1);
+                                                                                      //  set_reorderable: [1]
+                                                                                              
+                                                                        var description = new Pango.FontDescription.c_new();
+                                                                description.set_size(8000);
+                                                                this.el.modify_font(description);
+                                                                
+                                                                this.selection = this.el.get_selection();
+                                                                this.selection.set_mode( Gtk.SelectionMode.SINGLE);
+                                                               // this.selection.signal['changed'].connect(function() {
+                                                                //    _view.listeners['cursor-changed'].apply(_view, [ _view, '']);
+                                                                //});
+                                                                // see: http://live.gnome.org/GnomeLove/DragNDropTutorial
+                                                                 
+                                                                Gtk.drag_source_set (
+                                                                        this.el,            /* widget will be drag-able */
+                                                                        Gdk.ModifierType.BUTTON1_MASK,       /* modifier that will start a drag */
+                                                                        null,            /* lists of target to support */
+                                                                        0,              /* size of list */
+                                                                        Gdk.DragAction.COPY         /* what to do with data after dropped */
+                                                                );
+                                                                //Gtk.drag_source_set_target_list(this.el, LeftTree.targetList);
+                                                               
+                                                                Gtk.drag_source_set_target_list(this.el, this.get('/Window').targetList);
+                                                                Gtk.drag_source_add_text_targets(this.el); 
+                                                                /*
+                                                                print("RP: TARGET:" + LeftTree.atoms["STRING"]);
+                                                                targets = new Gtk.TargetList();
+                                                                targets.add( LeftTree.atoms["STRING"], 0, 0);
+                                                                targets.add_text_targets( 1 );
+                                                                Gtk.drag_dest_set_target_list(this.el, LeftTree.targetList);
+                                                                
+                                                                //if you want to allow text to be output elsewhere..
+                                                                //Gtk.drag_source_add_text_targets(this.el);
+                                                                */
+                                                                return true; 
+                                                            },
+                                                            items : [
+                                                                {
+                                                                    xtype: Gtk.ListStore,
+                                                                    pack : "set_model",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                    this.el.set_column_types ( 2, [
+                                                                                                GObject.TYPE_STRING, // title 
+                                                                                                GObject.TYPE_STRING // tip
+                                                                                                
+                                                                                                ] );
+                                                                    },
+                                                                    id : "model",
+                                                                    load : function(tr,iter)
+                                                                    {
+                                                                        if (!iter) {
+                                                                            this.el.clear();
+                                                                        }
+                                                                        //console.log('Project tree load: ' + tr.length);
+                                                                        var citer = new Gtk.TreeIter();
+                                                                        //this.insert(citer,iter,0);
+                                                                        for(var i =0 ; i < tr.length; i++) {
+                                                                            if (!iter) {
+                                                                                
+                                                                                this.el.append(citer);   
+                                                                            } else {
+                                                                                this.el.insert(citer,iter,-1);
+                                                                            }
+                                                                            
+                                                                            var r = tr[i];
+                                                                            //Seed.print(r);
+                                                                            this.el.set_value(citer, 0,  '' +  r ); // title 
+                                                                            
+                                                                            //this.el.set_value(citer, 1,  new GObject.Value( r)); //id
+                                                                            //if (r.cn && r.cn.length) {
+                                                                            //    this.load(r.cn, citer);
+                                                                            //}
+                                                                        }
+                                                                        
+                                                                        
+                                                                    },
+                                                                    getValue : function (iter, col) {
+                                                                        var gval = new GObject.Value('');
+                                                                         this.el.get_value(iter, col ,gval);
+                                                                        return  gval.value;
+                                                                        
+                                                                        
+                                                                    }
+                                                                },
+                                                                {
+                                                                    xtype: Gtk.TreeViewColumn,
+                                                                    pack : "append_column",
+                                                                    init : function() {
+                                                                        XObject.prototype.init.call(this);
+                                                                       this.el.add_attribute(this.items[0].el , 'markup', 0 );
+                                                                    },
+                                                                    items : [
+                                                                        {
+                                                                            xtype: Gtk.CellRendererText,
+                                                                            pack : "pack_start"
+                                                                        }
+                                                                    ]
+                                                                }
+                                                            ]
+                                                        }
+                                                    ]
+                                                }
+                                            ]
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    ]
+                }
+            ]
+        }
+    ]
+});
+Window.init();
+XObject.cache['/Window'] = Window;

diff --git a/XObjectBase/GtkCellRenderText.js b/XObjectBase/GtkCellRenderText.js
new file mode 100644 (file)
index 0000000..4407c9a
--- /dev/null
+++ b/XObjectBase/GtkCellRenderText.js
@@ -0,0 +1,10 @@
+
+//<Script type="Text/javascript">
+
+XObject = imports.XObject.XObject
+ 
+// Cell render text..
+
+GtkCellRenderText = {
+    pack : 'pack_start'
+}; 
\ No newline at end of file

diff --git a/XObjectBase/GtkTreeViewColumn.js b/XObjectBase/GtkTreeViewColumn.js
new file mode 100644 (file)
index 0000000..e1b9eb6
--- /dev/null
+++ b/XObjectBase/GtkTreeViewColumn.js
@@ -0,0 +1,13 @@
+
+
+//<Script type="Text/javascript">
+
+XObject = imports.XObject.XObject
+ 
+// Cell render text..
+
+
+GtkTreeViewColumn = {
+    pack : 'append_column'
+}; 
+