1 //<Script type="text/javascript">
5 GObject = imports.gi.GObject;
6 Pango = imports.gi.Pango ;
7 WebKit= imports.gi.WebKit;
10 * The based browser component - draws html/js lib based elements.
12 * the API for the rendered HTML goes like this:
14 * Builder.render(.... json string ...)
15 * Builder.overPos(" + x +','+ y + ");"); // mouse hovering over this pos..
18 * callbacks are done with.. console.log(
19 * .. { id : 'xxx' } - highlights an elements
20 * { width : xx } = sets the width of the selected element (with id)
21 * { height: xx } = sets the width of the selected element (with id)
22 * .. { hover-node : 'xxx' } - response to overPos
24 * basic dumping is done with alert();
30 XObject = imports.XObject.XObject;
31 File = imports.File.File;
32 console = imports.console;
34 LeftTree = imports.Builder.LeftTree.LeftTree ;
35 LeftPanel = imports.Builder.LeftPanel.LeftPanel;
36 //console.dump(imports.Builder.LeftTree);
39 RightBrowser = new XObject({
41 pack : [ 'append_page', new Gtk.Label({ label : "Roo View" }) ],
46 pack : [ 'pack_start', false, true, 0 ],
53 pack : [ 'pack_start', false, false, 0 ],
56 'button-press-event' : function(w, ev ){
58 RightBrowser.get('view').el.execute_script(
59 "console.log(document.body.innerHTML);");
60 RightBrowser.get('view').el.execute_script(
61 "console.log(Builder.dump(Builder));");
63 // show the MidPropTree..
74 xtype: Gtk.ScrolledWindow,
77 shadow_type : Gtk.ShadowType.IN ,
79 XObject.prototype.init.call(this);
81 this.el.set_policy(Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
89 xtype : WebKit.WebView,
93 XObject.prototype.init.call(this);
95 this.el.open('file:///' + __script_path__ + '/../builder.html');
99 this.el, /* widget that will accept a drop */
100 Gtk.DestDefaults.MOTION | Gtk.DestDefaults.HIGHLIGHT,
101 null, /* lists of target to support */
102 0, /* size of list */
103 Gdk.DragAction.COPY /* what to do with data after dropped */
106 // print("RB: TARGETS : " + LeftTree.atoms["STRING"]);
107 Gtk.drag_dest_set_target_list(this.el, LeftTree.targetList);
108 //Gtk.drag_dest_add_text_targets(this.el);
114 'load-finished' : function() {
115 if (this.ready) { // dont do it twice!
120 this.renderJS(LeftTree.get('model').toJS()[0]);
121 // this.el.execute_script("alert(document.documentElement.innerHTML);");
123 // we should really use console...
124 'script-alert' : function(w,s,r) {
129 'console-message' : function (a,b,c) {
131 if (!b.match(/^\{/)) {
132 return false; // do not handle!!! -> later maybe in console..
135 var val = JSON.parse(b);
136 if (typeof(val['hover-node']) != 'undefined') {
137 this.activeNode = val['hover-node'];
138 console.log('active node: ' + this.activeNode);
142 if (typeof(val['id']) != 'undefined') {
143 // this.activeNode = val['id'];
144 var tg = LeftTree.get('model').findDropNode(val['id'], true);
148 LeftTree.get('view').selectNode(tg[0]);
152 if (ret && typeof(val['set']) != 'undefined') {
153 LeftPanel.get('model').add({
157 //console.log('active node: ' + this.activeNode);
160 //Seed.print('a:'+a);
161 //Seed.print('b:'+b);
162 //Seed.print('c:'+c);
166 "drag-leave" : function () {
167 Seed.print("TARGET: drag-leave");
168 // stop monitoring of mouse montion in rendering..
171 'drag-motion' : function (w, ctx, x, y, time, ud)
175 // console.log('DRAG MOTION');
177 // if lastCurrentNode == this.currentNode.. -- don't change anything..
178 this.targetData = [];
179 this.el.execute_script("Builder.overPos(" + x +','+ y + ");");
181 // A) find out from drag all the places that node could be dropped.
182 var src = Gtk.drag_get_source_widget(ctx);
184 Gdk.drag_status(ctx, 0, time);
187 // b) get what we are over.. (from activeNode)
188 // tree is empty.. - list should be correct..
189 if (!LeftTree.get('model').currentTree) {
190 Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
194 // c) ask tree where it should be dropped... - eg. parent.. (after node ontop)
196 var tg = LeftTree.get('model').findDropNode(this.activeNode, src.dropList);
199 Gdk.drag_status(ctx, 0,time);
200 LeftTree.get('view').highlight(false);
204 // if we have a target..
205 // -> highlight it! (in browser)
206 // -> highlight it! (in tree)
208 Gdk.drag_status(ctx, Gdk.DragAction.COPY,time);
209 LeftTree.get('view').highlight(tg);
210 this.targetData = tg;
211 // for tree we should handle this...
214 "drag-drop" : function (w, ctx,x,y,time, ud)
217 Seed.print("TARGET: drag-drop");
218 is_valid_drop_site = true;
223 w, /* will receive 'drag-data-received' signal */
224 ctx, /* represents the current state of the DnD */
225 LeftTree.atoms["STRING"], /* the target type we want */
226 time /* time stamp */
230 /* No target offered by source => error */
233 return is_valid_drop_site;
237 "drag-data-received" : function (w, ctx, x, y, sel_data, target_type, time, ud)
239 Seed.print("Browser: drag-data-received");
240 delete_selection_data = false;
242 /* Deal with what we are given from source */
243 if( sel_data && sel_data.length ) {
245 if (ctx.action == Gdk.DragAction.ASK) {
246 /* Ask the user to move or copy, then set the ctx action. */
249 if (ctx.action == Gdk.DragAction.MOVE) {
250 delete_selection_data = true;
252 var source = Gtk.drag_get_source_widget(ctx);
254 Seed.print("Browser: source.DRAGDATA? " + source.dragData);
255 if (this.targetData) {
256 Seed.print(this.targetData);
257 LeftTree.get('model').dropNode(this.targetData, source.dragData);
266 if (dnd_success == false)
268 Seed.print ("DnD data transfer failed!\n");
271 Gtk.drag_finish (ctx, dnd_success, delete_selection_data, time);
275 //'line-mark-activated' : line_mark_activated,
279 renderJS: function(data) {
280 this.renderedData = data;
281 var str = JSON.stringify(data) ;
284 console.log('not loaded yet');
286 Seed.print("RENDER:" + str);
287 File.write('/tmp/builder.debug.js', "Builder.render(" + JSON.stringify(data) + ");");
288 this.el.execute_script("Builder.render(" + JSON.stringify(data) + ");");