debug/log changes
authorAlan Knowles <alan@akkbhome.com>
Sat, 9 Oct 2010 13:06:25 +0000 (21:06 +0800)
committerAlan Knowles <alan@akkbhome.com>
Sat, 9 Oct 2010 13:06:25 +0000 (21:06 +0800)
ClutterTest/Window.bjs
ClutterTest/Window.js
Sample/Window.bjs
Sample/Window.js
XObject.js
gtkrun.js

index 6be88a8..0c6f46f 100644 (file)
@@ -8,27 +8,34 @@
         {
             "default_height": 900,
             "default_width": 900,
+            "id": "Window",
             "xtype": "Window",
             "|init": "function() {\n    XObject.prototype.init.call(this);\n    this.el.show_all();\n}\n",
             "|xns": "Gtk",
             "items": [
                 {
+                    "id": "Canvas",
                     "pack": "add",
                     "xtype": "Embed",
+                    "|activate": "function(elname) \n{\n\n    // enter event. - triggers start of possible re-arrange.\n    // --> 'next event'\n    // leave notify event...- cancel..\n    // --> clear next event\n    \n    \n    \n    \n\n\n   // prevent dupes\n   \n/*   if (this.lastAct) {\n       if (((new Date()) - this.lastAct)  < 1000) {\n            return;\n        }\n   \n    }\n    */\n    this.lastAct = new Date();\n\n   // THIS NEEDS TO ACTIVATE CERTIAN LAYOUTS BASED ON WHAT ELEMENT\n   // HAS BEEN ACTIVATED.\n   var  Clutter = imports.gi.Clutter;\n   var _t = this;\n   \n   var moved = [];\n   function mv(en, opts) {\n        moved.push(en);\n         if (opts.scale && !opts.scale_x) {\n            opts.scale_x = opts.scale;\n        }\n         if (opts.scale && !opts.scale_y) {\n            opts.scale_y = opts.scale;\n        }\n        if (opts.scale) {\n            delete opts.scale;\n        }\n        var anim =  _t.get(en).el.animate(    Clutter.AnimationMode.EASE_OUT_ELASTIC, 1000, opts         );\n        \n        anim.timeline.start();\n   }\n   var left = ['project',  'parts', 'props'  ];\n   var right = [ 'filelist',  'editor', 'preview', 'palete' ];\n   function emin() {\n   \n        left.forEach(function(e) {\n            if (moved.indexOf(e) > -1) { return; } // already moved\n            mv(e, { scale : 0.5, x : 5, y : left.indexOf(e)*60} );\n        });\n        right.forEach(function(e) {\n            if (moved.indexOf(e) > -1) { return; } // already moved\n            mv(e, { scale : 0.5, x : 700 , y : right.indexOf(e)*60} );\n        });\n   }\n   \n   // reserve left < 100 for icons...\n   // elements have a few 'scale' states\n   // a) minimized '50x50' box on left or right....\n   // b) full size\n   // c) reduced size (visible but not active..)\n   \n    // active element should always end up on left...\n   \n    switch (elname) {\n        case 'project':\n        case 'filelist': \n        \n            mv('project',   { scale : 2, x : 100 , y : 0}); // full left.\n            mv('filelist',  { scale : 2, x : 400 , y : 0}); // right.           \n             break;\n           \n            \n        case 'parts': // tree of parts\n        case 'props':        \n            mv('parts',   { scale : 2, x : 60 , y : 0}); // full left.\n            mv('props',   { scale : 2, x : 60 , y : 200}); // bottom (full)\n            mv('preview',   { scale : 1, x : 260 , y : 0}); // right (half.)\n             break;\n           \n\n        case 'editor':\n            // editor = props / tree and editor (main!)\n            mv('editor',   { scale : 3, x : 300 , y : 0}); // main?\n            \n            mv('props',   { scale : 2, x : 60 , y : 0}); // bottom (full)\n           mv('parts',   { scale : 2, x : 60 , y : 200}); // full left.     \n\n            break;\n            \n        case 'preview':\n            // preview... debugger is probably helpful..?\n             mv('parts',   { scale : 1, x : 60 , y : 0}); // full left.\n             mv('props',   { scale : 1, x : 60 , y : 200}); // bottom (full)\n             mv('preview',   { scale : 3, x : 160 , y : 0}); // right (half.)\n             break;\n            break;\n\n        case 'palete':\n            mv('parts',   { scale : 2, x : 60 , y : 0}); // full left.\n            mv('palete',   { scale : 2, x : 500 , y : 0}); // bottom (full)\n            \n            break;\n    \n    }\n                emin();\n    \n/*\n   \n    if (this.lastEl) {\n        mv(this.lastEl, { scale: 0.5 });\n    }\n    \n    this.lastEl = elname;\n    mv(elname, { scale: 2});\n    */\n}\n",
+                    "|enter": "function(n) {\n    print(\"ENTER : \" + n);\n    this.nextActor = n;\n    // start countdown..\n    this.entered = new Date();\n    // set up a timeout..\n    if (this.hasTimeout) {\n        return;\n    }\n    var _t = this;\n    this.hasTimeout = GLib.timeout_add (GLib.PRIORITY_DEFAULT, 100, function() { \n\n        if (!_t.nextActor) { // no actor..\n          //  print(\"no actor\");\n            return true;\n        }\n        // lapsed\n        var lapsed = ((new Date()) - _t.entered);\n        //print (\"lapsed: \" + lapsed);\n        if (lapsed < 1000) { // not enought time yet..\n            //print(\"not yet\");\n            return true;\n        }\n        var na =         _t.nextActor + '';\n        _t.nextActor = false;\n        _t.activate(na);\n        return true;\n    });\n}\n",
+                    "|leave": "function() {\n    this.nextActor = false;\n}\n",
                     "|xns": "GtkClutter",
-                    "listeners": {},
                     "items": [
                         {
+                            "id": "project",
                             "pack": false,
+                            "scale_x": 0.5,
+                            "scale_y": 0.5,
                             "x": 10,
                             "xtype": "Actor",
                             "y": 10,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n    Clutter = imports.gi.Clutter;\n    var animate = this.parent.el.animate(\n        Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n        {\n\t       scale_x : 5,\n\t      scale_y: 5,\n\n        }\n    );\n    animate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n   this.get('/Canvas').enter('project');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\nprint(\"leave not event?\");\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
                                     "height_request": 100,
                                     "label": "project list",
                             ]
                         },
                         {
+                            "id": "filelist",
                             "pack": false,
                             "x": 10,
                             "xtype": "Actor",
                             "y": 150,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n   Clutter = imports.gi.Clutter;\n        var animate = this.parent.el.animate(\n\t\tClutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n\t\t{\n\t\t\t   scale_x : 5,\n\t\t\t  scale_y: 5,\n\n\t\t}\n\t\t);\n\t\tanimate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n   this.get('/Canvas').enter('filelist');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
                                     "height_request": 100,
                                     "label": "file list",
                             ]
                         },
                         {
+                            "id": "parts",
                             "pack": false,
                             "x": 10,
                             "xtype": "Actor",
                             "y": 300,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n   Clutter = imports.gi.Clutter;\n        var animate = this.parent.el.animate(\n\t\tClutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n\t\t{\n\t\t\t   scale_x : 5,\n\t\t\t  scale_y: 5,\n\n\t\t}\n\t\t);\n\t\tanimate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n   this.get('/Canvas').enter('parts');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
-                                    "height_request": 100,
-                                    "label": "tree of parts",
-                                    "pack": false,
-                                    "width_request": 100,
-                                    "xtype": "Button",
-                                    "|xns": "Gtk"
+                                    "height_request": 400,
+                                    "id": "LeftTree",
+                                    "pack": "false",
+                                    "width_request": 150,
+                                    "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 \treturn;\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    return;\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        this.file.items = this.toJS(false, false);\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            //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"
+                                                }
+                                            ]
+                                        }
+                                    ]
                                 }
                             ]
                         },
                         {
+                            "id": "props",
                             "pack": false,
                             "x": 10,
                             "xtype": "Actor",
                             "y": 450,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n   Clutter = imports.gi.Clutter;\n        var animate = this.parent.el.animate(\n\t\tClutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n\t\t{\n\t\t\t   scale_x : 5,\n\t\t\t  scale_y: 5,\n\n\t\t}\n\t\t);\n\t\tanimate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n  this.get('/Canvas').enter('props');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
                                     "height_request": 100,
                                     "label": "property editor",
                             ]
                         },
                         {
+                            "id": "editor",
                             "pack": false,
                             "x": 150,
                             "xtype": "Actor",
                             "y": 450,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n   Clutter = imports.gi.Clutter;\n        var animate = this.parent.el.animate(\n\t\tClutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n\t\t{\n\t\t\t   scale_x : 5,\n\t\t\t  scale_y: 5,\n\n\t\t}\n\t\t);\n\t\tanimate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n    this.get('/Canvas').enter('editor');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
                                     "height_request": 100,
                                     "label": "text editor",
                             ]
                         },
                         {
+                            "id": "preview",
                             "pack": false,
                             "x": 150,
                             "xtype": "Actor",
                             "y": 10,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n   Clutter = imports.gi.Clutter;\n        var animate = this.parent.el.animate(\n\t\tClutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n\t\t{\n\t\t\t   scale_x : 5,\n\t\t\t  scale_y: 5,\n\n\t\t}\n\t\t);\n\t\tanimate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n    this.get('/Canvas').enter('preview');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
                                     "height_request": 100,
                                     "label": "preview app",
                             ]
                         },
                         {
+                            "id": "palete",
                             "pack": false,
                             "x": 100,
                             "xtype": "Actor",
                             "y": 300,
                             "|xns": "GtkClutter",
-                            "listeners": {},
                             "items": [
                                 {
                                     "listeners": {
-                                        "clicked": "function (self) {\n   Clutter = imports.gi.Clutter;\n        var animate = this.parent.el.animate(\n\t\tClutter.AnimationMode.EASE_OUT_ELASTIC, 2000,\n\t\t{\n\t\t\t   scale_x : 5,\n\t\t\t  scale_y: 5,\n\n\t\t}\n\t\t);\n\t\tanimate.timeline.start();\n\n}"
+                                        "enter_notify_event": "function (self, event) {\n  this.get('/Canvas').enter('palete');\n    return false;\n}",
+                                        "leave_notify_event": "function (self, event) {\n   this.get('/Canvas').leave();\n    return false;\n}"
                                     },
                                     "height_request": 100,
                                     "label": "palete",
index 24fc972..15ed84c 100644 (file)
@@ -14,6 +14,7 @@ Window=new XObject({
     xtype: Gtk.Window,
     default_height : 900,
     default_width : 900,
+    id : "Window",
     init : function() {
         XObject.prototype.init.call(this);
         this.el.show_all();
@@ -21,29 +22,181 @@ Window=new XObject({
     items : [
         {
             xtype: GtkClutter.Embed,
+            id : "Canvas",
             pack : "add",
+            activate : function(elname) 
+            {
+            
+                // enter event. - triggers start of possible re-arrange.
+                // --> 'next event'
+                // leave notify event...- cancel..
+                // --> clear next event
+                
+                
+                
+                
+            
+            
+               // prevent dupes
+               
+            /*   if (this.lastAct) {
+                   if (((new Date()) - this.lastAct)  < 1000) {
+                        return;
+                    }
+               
+                }
+                */
+                this.lastAct = new Date();
+            
+               // THIS NEEDS TO ACTIVATE CERTIAN LAYOUTS BASED ON WHAT ELEMENT
+               // HAS BEEN ACTIVATED.
+               var  Clutter = imports.gi.Clutter;
+               var _t = this;
+               
+               var moved = [];
+               function mv(en, opts) {
+                    moved.push(en);
+                     if (opts.scale && !opts.scale_x) {
+                        opts.scale_x = opts.scale;
+                    }
+                     if (opts.scale && !opts.scale_y) {
+                        opts.scale_y = opts.scale;
+                    }
+                    if (opts.scale) {
+                        delete opts.scale;
+                    }
+                    var anim =  _t.get(en).el.animate(    Clutter.AnimationMode.EASE_OUT_ELASTIC, 1000, opts         );
+                    
+                    anim.timeline.start();
+               }
+               var left = ['project',  'parts', 'props'  ];
+               var right = [ 'filelist',  'editor', 'preview', 'palete' ];
+               function emin() {
+               
+                    left.forEach(function(e) {
+                        if (moved.indexOf(e) > -1) { return; } // already moved
+                        mv(e, { scale : 0.5, x : 5, y : left.indexOf(e)*60} );
+                    });
+                    right.forEach(function(e) {
+                        if (moved.indexOf(e) > -1) { return; } // already moved
+                        mv(e, { scale : 0.5, x : 700 , y : right.indexOf(e)*60} );
+                    });
+               }
+               
+               // reserve left < 100 for icons...
+               // elements have a few 'scale' states
+               // a) minimized '50x50' box on left or right....
+               // b) full size
+               // c) reduced size (visible but not active..)
+               
+                // active element should always end up on left...
+               
+                switch (elname) {
+                    case 'project':
+                    case 'filelist': 
+                    
+                        mv('project',   { scale : 2, x : 100 , y : 0}); // full left.
+                        mv('filelist',  { scale : 2, x : 400 , y : 0}); // right.           
+                         break;
+                       
+                        
+                    case 'parts': // tree of parts
+                    case 'props':        
+                        mv('parts',   { scale : 2, x : 60 , y : 0}); // full left.
+                        mv('props',   { scale : 2, x : 60 , y : 200}); // bottom (full)
+                        mv('preview',   { scale : 1, x : 260 , y : 0}); // right (half.)
+                         break;
+                       
+            
+                    case 'editor':
+                        // editor = props / tree and editor (main!)
+                        mv('editor',   { scale : 3, x : 300 , y : 0}); // main?
+                        
+                        mv('props',   { scale : 2, x : 60 , y : 0}); // bottom (full)
+                       mv('parts',   { scale : 2, x : 60 , y : 200}); // full left.     
+            
+                        break;
+                        
+                    case 'preview':
+                        // preview... debugger is probably helpful..?
+                         mv('parts',   { scale : 1, x : 60 , y : 0}); // full left.
+                         mv('props',   { scale : 1, x : 60 , y : 200}); // bottom (full)
+                         mv('preview',   { scale : 3, x : 160 , y : 0}); // right (half.)
+                         break;
+                        break;
+            
+                    case 'palete':
+                        mv('parts',   { scale : 2, x : 60 , y : 0}); // full left.
+                        mv('palete',   { scale : 2, x : 500 , y : 0}); // bottom (full)
+                        
+                        break;
+                
+                }
+                            emin();
+                
+            /*
+               
+                if (this.lastEl) {
+                    mv(this.lastEl, { scale: 0.5 });
+                }
+                
+                this.lastEl = elname;
+                mv(elname, { scale: 2});
+                */
+            },
+            enter : function(n) {
+                print("ENTER : " + n);
+                this.nextActor = n;
+                // start countdown..
+                this.entered = new Date();
+                // set up a timeout..
+                if (this.hasTimeout) {
+                    return;
+                }
+                var _t = this;
+                this.hasTimeout = GLib.timeout_add (GLib.PRIORITY_DEFAULT, 100, function() { 
+            
+                    if (!_t.nextActor) { // no actor..
+                      //  print("no actor");
+                        return true;
+                    }
+                    // lapsed
+                    var lapsed = ((new Date()) - _t.entered);
+                    //print ("lapsed: " + lapsed);
+                    if (lapsed < 1000) { // not enought time yet..
+                        //print("not yet");
+                        return true;
+                    }
+                    var na =         _t.nextActor + '';
+                    _t.nextActor = false;
+                    _t.activate(na);
+                    return true;
+                });
+            },
+            leave : function() {
+                this.nextActor = false;
+            },
             items : [
                 {
                     xtype: GtkClutter.Actor,
+                    id : "project",
                     pack : false,
+                    scale_x : 0.5,
+                    scale_y : 0.5,
                     x : 10,
                     y : 10,
                     items : [
                         {
                             xtype: Gtk.Button,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                   this.get('/Canvas').enter('project');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                print("leave not event?");
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
                             height_request : 100,
@@ -55,6 +208,7 @@ Window=new XObject({
                 },
                 {
                     xtype: GtkClutter.Actor,
+                    id : "filelist",
                     pack : false,
                     x : 10,
                     y : 150,
@@ -62,18 +216,13 @@ Window=new XObject({
                         {
                             xtype: Gtk.Button,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                   this.get('/Canvas').enter('filelist');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
                             height_request : 100,
@@ -85,36 +234,1058 @@ Window=new XObject({
                 },
                 {
                     xtype: GtkClutter.Actor,
+                    id : "parts",
                     pack : false,
                     x : 10,
                     y : 300,
                     items : [
                         {
-                            xtype: Gtk.Button,
+                            xtype: Gtk.ScrolledWindow,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                   this.get('/Canvas').enter('parts');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
-                            height_request : 100,
-                            label : "tree of parts",
-                            pack : false,
-                            width_request : 100
+                            height_request : 400,
+                            id : "LeftTree",
+                            pack : "false",
+                            width_request : 150,
+                            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?");
+                                               return;
+                                                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) {
+                                            return;
+                                             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];
+                                                    this.file.items = this.toJS(false, false);
+                                                  //  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();
+                                                        //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: GtkClutter.Actor,
+                    id : "props",
                     pack : false,
                     x : 10,
                     y : 450,
@@ -122,18 +1293,13 @@ Window=new XObject({
                         {
                             xtype: Gtk.Button,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                  this.get('/Canvas').enter('props');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
                             height_request : 100,
@@ -145,6 +1311,7 @@ Window=new XObject({
                 },
                 {
                     xtype: GtkClutter.Actor,
+                    id : "editor",
                     pack : false,
                     x : 150,
                     y : 450,
@@ -152,18 +1319,13 @@ Window=new XObject({
                         {
                             xtype: Gtk.Button,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                    this.get('/Canvas').enter('editor');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
                             height_request : 100,
@@ -175,6 +1337,7 @@ Window=new XObject({
                 },
                 {
                     xtype: GtkClutter.Actor,
+                    id : "preview",
                     pack : false,
                     x : 150,
                     y : 10,
@@ -182,18 +1345,13 @@ Window=new XObject({
                         {
                             xtype: Gtk.Button,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                    this.get('/Canvas').enter('preview');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
                             height_request : 100,
@@ -205,6 +1363,7 @@ Window=new XObject({
                 },
                 {
                     xtype: GtkClutter.Actor,
+                    id : "palete",
                     pack : false,
                     x : 100,
                     y : 300,
@@ -212,18 +1371,13 @@ Window=new XObject({
                         {
                             xtype: Gtk.Button,
                             listeners : {
-                                clicked : function (self) {
-                                   Clutter = imports.gi.Clutter;
-                                        var animate = this.parent.el.animate(
-                                               Clutter.AnimationMode.EASE_OUT_ELASTIC, 2000,
-                                               {
-                                                          scale_x : 5,
-                                                         scale_y: 5,
-                                
-                                               }
-                                               );
-                                               animate.timeline.start();
-                                
+                                enter_notify_event : function (self, event) {
+                                  this.get('/Canvas').enter('palete');
+                                    return false;
+                                },
+                                leave_notify_event : function (self, event) {
+                                   this.get('/Canvas').leave();
+                                    return false;
                                 }
                             },
                             height_request : 100,
index 146394d..fda75e4 100644 (file)
@@ -1,5 +1,5 @@
 {
-    "id": "file-gtk-1",
+    "id": "file-gtk-7",
     "name": "Window",
     "parent": "",
     "title": false,
                                                     "items": [
                                                         {
                                                             "listeners": {
-                                                                "activate": "function (self) {\n\tvar nb = this.get('/LeftTopPanel.notebook');\n\tif (this.el.expanded) {\n\t    // now expanded..\n            \n\t    var pm  = imports.Builder.Provider.ProjectManager.ProjectManager;\n\t    \n\t   \n\t    var model = this.get('/LeftProjectTree.combomodel');\n\t  //  print (\"loading Projects?\")\n\t//console.dump(pm.projects);\n\t    model.loadData(pm.projects);\n\t     \n\t    \n\t    nb.el.set_current_page(1);\n\t    //pm.on('changed', function() {\n\t\t//console.log(\"CAUGHT project manager change\");\n\t    //    _combo.model.loadData(pm.projects);\n\t    //}\n\t    return;\n\t}\n\tnb.el.set_current_page(0);\n}",
-                                                                "enter_notify_event": "function (self, event) {\n     this.el.expanded = !this.el.expanded;\n//if (this.el.expanded ) {\n    this.listeners.activate.call(this);\n//   }\n\nreturn true;\n}"
+                                                                "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"
                                                         },
                                                         {
                                                                             "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.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}"
+                                                                                        "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,
index 9c9d096..9c9479b 100644 (file)
@@ -338,29 +338,20 @@ Window=new XObject({
                                                     xtype: Gtk.Expander,
                                                     listeners : {
                                                         activate : function (self) {
-                                                               var nb = this.get('/LeftTopPanel.notebook');
-                                                               if (this.el.expanded) {
-                                                                   // now expanded..
-                                                                    
-                                                                   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;
-                                                               }
-                                                               nb.el.set_current_page(0);
+                                                            // 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);
@@ -372,9 +363,32 @@ Window=new XObject({
                                                     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;
                                                     }
                                                 },
                                                 {
@@ -1561,7 +1575,8 @@ Window=new XObject({
                                                                                 
                                                                                         var nb = this.get('/LeftTopPanel.expander');
                                                                                         nb.el.expanded = false;
-                                                                                        nb.listeners.activate.call(nb);
+                                                                                        nb.onCollapse();
+                                                                                        //nb.listeners.activate.call(nb);
                                                                                         //_expander.el.set_expanded(false);
                                                                                 
                                                                                         var ltm = this.get('/LeftTree.model');
index 83e335a..4934b95 100644 (file)
@@ -81,7 +81,7 @@ function XObject (cfg) {
         
     } catch (e) {
         // if debug?
-        print("error finding " + gname + " - " + e.toString());
+        XObject.log("error finding " + gname + " - " + e.toString());
     }
     
     
@@ -207,14 +207,14 @@ XObject.prototype = {
         var isSeed = typeof(Seed) != 'undefined';
          
         // xtype= Gtk.Menu ?? what about c_new stuff?
-        if (XObject.debug) print("init: ID:"+ this.id +" typeof(xtype): "  + typeof(this.xtype));
+        XObject.log("init: ID:"+ this.id +" typeof(xtype): "  + typeof(this.xtype));
         if (!this.el && typeof(this.xtype) == 'function') {
-            if (XObject.debug) print("func?"  + XObject.keys(this.config).join(','));
+            XObject.log("func?"  + XObject.keys(this.config).join(','));
             this.el = this.xtype(this.config);
            
         }
         if (!this.el && typeof(this.xtype) == 'object') {
-            if (XObject.debug) print("obj?"  + XObject.keys(this.config).join(','));
+            XObject.log("obj?"  + XObject.keys(this.config).join(','));
             this.el = new (this.xtype)(this.config);
       
         }
@@ -223,16 +223,16 @@ XObject.prototype = {
             
             var NS = imports.gi[this.xns];
             if (!NS) {
-                Seed.print('Invalid xns: ' + this.xns);
+                XObject.error('Invalid xns: ' + this.xns, true);
             }
             constructor = NS[this.xtype];
             if (!constructor) {
-                Seed.print('Invalid xtype: ' + this.xns + '.' + this.xtype);
+                XObject.error('Invalid xtype: ' + this.xns + '.' + this.xtype);
             }
             this.el  =   isSeed ? new constructor(this.config) : new constructor();
             
         }
-        if (XObject.debug) print("init: ID:"+ this.id +" typeof(el):" + this.el);
+        XObject.log("init: ID:"+ this.id +" typeof(el):" + this.el);
         
         // always overlay props..
         // check for 'write' on object..
@@ -276,7 +276,7 @@ XObject.prototype = {
         //}
         
         var type = this.xtype.type ? GObject.type_name(this.xtype.type) : '';
-        print("add children to " + type);
+        XObject.log("add children to " + type);
         
         var _this=this;
         this.items.forEach(function(i,n) {
@@ -307,7 +307,7 @@ XObject.prototype = {
     {
         
         if (typeof(item) == 'undefined') {
-            print("Invalid Item added to this!");
+            XObject.error("Invalid Item added to this!");
             imports.console.dump(this);
             Seed.quit();
         }
@@ -317,7 +317,7 @@ XObject.prototype = {
         //print("CTR:PROTO:" + ( item.id ? item.id : '??'));
        // print("addItem - call init [" + item.pack.join(',') + ']');
         if (!item.el) {
-            print("NO EL!");
+            XObject.err("NO EL!");
             imports.console.dump(item);
             Seed.quit();
         }
@@ -389,7 +389,7 @@ XObject.prototype = {
         
         
         
-        if (XObject.debug) print(pack_m + '[' + args.join(',') +']');
+        XObject.log(pack_m + '[' + args.join(',') +']');
         //Seed.print('args: ' + args.length);
         if (pack_m) {
             this.el[pack_m].apply(this.el, args);
@@ -408,7 +408,7 @@ XObject.prototype = {
     addListener  : function(sig, fn) 
     {
  
-        if (XObject.debug) Seed.print("Add signal " + sig);
+        XObject.log("Add signal " + sig);
         fn.id= sig;
         var _li = XObject.createDelegate(fn,this);
         // private listeners that are not copied to GTk.
@@ -434,7 +434,7 @@ XObject.prototype = {
       */
     get : function(xid)
     {
-        if (XObject.debug) print("SEARCH FOR " + xid + " in " + this.id);
+        XObject.log("SEARCH FOR " + xid + " in " + this.id);
         var ret=  false;
         var oid = '' + xid;
         if (!xid.length) {
@@ -530,7 +530,7 @@ XObject.prototype = {
                 return;
             }
             if (!ch.get) {
-                print("invalid item...");
+                XObject.error("invalid item...");
                 imports.console.dump(_this);
                 Seed.quit();
             }
@@ -592,7 +592,7 @@ XObject.extend(XObject,
      * @property {Boolean} debug XObject  debugging.  - set to true to debug.
      * 
      */
-    debug : true,
+    debug : false,
     /**
      * @property {Object} cache - cache of object ids
      * 
@@ -603,7 +603,31 @@ XObject.extend(XObject,
      * 
      */
     emptyFn : function () { },
-        
+      
+      
+      
+    /**
+     * Debug Logging
+     * @param {String|Object} output String to print.
+     */
+    log : function(output)
+    {
+        if (!this.debug) {
+            return;
+        }
+        print("LOG:" + output);  
+    },
+     
+    /**
+     * Error Logging
+     * @param {String|Object} output String to print.
+     */
+    error : function(output)
+    {
+        print("ERROR: " + output);  
+    },
+     
+   
     /**
      * Copies all the properties of config to obj, if the do not exist.
      * @param {Object} obj The receiver of the properties
@@ -661,14 +685,14 @@ XObject.extend(XObject,
         };
         return function(constructor, parentClass, overrides) {
             if (typeof(parentClass) == 'undefined') {
-                print("XObject.define: Missing parentClass: when applying: " );
-                print(new String(constructor));
+                XObject.error("XObject.define: Missing parentClass: when applying: " );
+                XObject.error(new String(constructor));
                 Seed.quit(); 
             }
             if (typeof(parentClass.prototype) == 'undefined') {
-                print("Missing protype: when applying: " );
-                print(new String(constructor));
-                print(new String(parentClass));
+                XObject.error("Missing protype: when applying: " );
+                XObject.error(new String(constructor));
+                XObject.error(new String(parentClass));
                 Seed.quit(); 
             }
             var F = function(){};
@@ -723,7 +747,7 @@ XObject.extend(XObject,
     createDelegate : function(method, obj, args, appendArgs){
         
         return function() {
-            if (XObject.debug) print("CALL: " + obj.id + ':'+ method.id);
+            XObject.log("CALL: " + obj.id + ':'+ method.id);
             
             var callArgs = args || arguments;
             if(appendArgs === true){
index 94c96cb..1be3b77 100644 (file)
--- a/gtkrun.js
+++ b/gtkrun.js
 // sort out import path!!!
  
  
-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;
+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;
 
-GtkClutter = imports.gi.GtkClutter;
 if (GtkClutter) {    
     GtkClutter.init(Seed.argv);
 }
 
-File = imports.File.File;
+File    = imports.File.File;
 
 XObject = imports.XObject.XObject;
 //XObject.debug = true;
 Gtk.init(Seed.argv);
+
+
 imports.searchPath.push('/'); // allow global paths..
 // error checking todo..
 var files = File.list(Seed.argv[2]);
@@ -64,7 +67,7 @@ files.forEach(function(f) {
     if (File.isFile(js)) {
         // check file time.. = bjs is less than compiled file..
         if (File.mtime(fp) < File.mtime(js)) {
-            print ("LOADING" + js);
+            XObject.log("LOADING" + js);
             olist.push(imports[js]);
             return;
         }
@@ -73,7 +76,7 @@ files.forEach(function(f) {
     }
     var gtkbuilder =  new imports.Builder.Provider.File.Gtk.Gtk({ path : fp });
     gtkbuilder.loadItems(function() { });
-    print ("COMPILING" + js);
+    XObject.log("COMPILING" + js);
     var fn = gtkbuilder.saveJS();
     if (fn === false) { // skip files that do not contain anythng!
         return;