git.roojs.org Git - app.Builder.js/blob - Builder/LeftPanel.js

   1 //<Script type="text/javascript">
   2 Gio = imports.gi.Gio;
   3 Gtk = imports.gi.Gtk;
   4 Gdk = imports.gi.Gdk;
   5 GLib = imports.gi.GLib;
   6 GObject = imports.gi.GObject;
   7 Pango = imports.gi.Pango ;
   8
   9 XObject = imports.XObject.XObject;
  10 console = imports.console;
  11
  12
  13 LeftPanelPopup  = imports.Builder.LeftPanelPopup.LeftPanelPopup;
  14 RightEditor     = imports.Builder.RightEditor.RightEditor;
  15 /**
  16  *
  17  * really the properties..
  18  */
  19
  20
  21 LeftPanel = new XObject({
  22
  23         xtype: Gtk.ScrolledWindow,
  24         smooth_scroll : true,
  25         pack : [ 'pack_end', true, true, 0 ],
  26         shadow_type : Gtk.ShadowType.IN,
  27
  28         init : function () {
  29             XObject.prototype.init.call(this);
  30             this.el.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
  31         },
  32         items : [
  33             {
  34                 id : 'view',
  35
  36                 xtype : Gtk.TreeView,
  37
  38                 tooltip_column : 1,
  39                 headers_visible :   false ,
  40                 enable_tree_lines :  true ,
  41
  42                 init : function () {
  43                     XObject.prototype.init.call(this);
  44
  45                     this.selection = this.el.get_selection();
  46                     this.selection.set_mode( Gtk.SelectionMode.SINGLE);
  47
  48
  49                     var description = new Pango.FontDescription.c_new();
  50                     description.set_size(8000);
  51                     this.el.modify_font(description);
  52                 },
  53                 listeners : {
  54
  55
  56                     'button-press-event' : function(tv, ev) {
  57                         if (ev.type != Gdk.EventType.BUTTON_PRESS  || ev.button.button != 3) {
  58                             Seed.print("click" + ev.type);
  59                             return false;
  60                         }
  61
  62
  63                         var res = { };
  64                         this.el.get_path_at_pos(ev.button.x,ev.button.y, res);
  65
  66                         if (res.column.title == 'value') {
  67                             return false;
  68                         }
  69                         if (!LeftPanelPopup.el) LeftPanelPopup.init();
  70                         LeftPanelPopup.el.set_screen(Gdk.Screen.get_default());
  71                         LeftPanelPopup.el.show_all();
  72                         LeftPanelPopup.el.popup(null, null, null, null, 3, ev.button.time);
  73                         Seed.print("click:" + res.column.title);
  74                         return false;
  75
  76                     }
  77                 },
  78                 items : [
  79
  80                     {
  81                         id : 'model',
  82                         pack : [ 'set_model' ],
  83                         xtype : Gtk.ListStore,
  84
  85                         init : function ()
  86                         {
  87                             XObject.prototype.init.call(this);
  88                             this.el.set_column_types ( 5, [
  89                                 GObject.TYPE_STRING,  // 0 real key
  90                                 GObject.TYPE_STRING, // 1 real value
  91                                  GObject.TYPE_STRING,  // 2 visable key
  92                                  GObject.TYPE_STRING, // 3 visable value
  93                                  GObject.TYPE_STRING, // 4 need to store type of!!!
  94
  95                             ]);
  96
  97
  98
  99                         },
 100                         toShort: function(str) {
 101                             var a = typeof(str) == 'string' ? str.split("\n") : [];
 102                             return a.length > 1 ? a[0] + '....' : '' + str;
 103                         },
 104                         load : function (ar)
 105                         {
 106                             this.el.clear();
 107
 108                             RightEditor.el.hide();
 109                             if (ar === false) {
 110                                 return ;
 111                             }
 112                             var ret = {};
 113
 114                             // sort!!!?
 115                             var iter = new Gtk.TreeIter();
 116                             for (var i in ar) {
 117                                 if (typeof(ar[i]) == 'object') {
 118                                     continue;
 119                                 }
 120                                 this.el.append(iter);
 121                                 var p = this.el.get_path(iter).to_string();
 122                                 ret[i] = p;
 123                                 this.el.set_value(iter, 0, i);
 124                                 this.el.set_value(iter, 1, '' + ar[i]);
 125                                 this.el.set_value(iter, 2, i);
 126                                 this.el.set_value(iter, 3, this.toShort(ar[i]));
 127                                 this.el.set_value(iter, 4, typeof(ar[i]));
 128                             }
 129                             ar.listeners = ar.listeners || {};
 130                             for (var i in ar.listeners ) {
 131                                 this.el.append(iter);
 132                                 var p = this.el.get_path(iter).to_string();
 133                                 ret['!' + i] = p;
 134
 135                                 this.el.set_value(iter, 0, '!'+  i  );
 136                                 this.el.set_value(iter, 1, '' + ar.listeners[i]);
 137                                 this.el.set_value(iter, 2, '<b>'+ i + '</b>');
 138
 139                                 this.el.set_value(iter, 3, '' + this.toShort(ar.listeners[i]));
 140                                 this.el.set_value(iter, 4, typeof(ar[i]));
 141                             }
 142                             return ret;
 143                         },
 144
 145
 146
 147                         add : function( info ) {
 148                             // info includes key, val, skel, etype..
 149                              console.dump(info);
 150                             type = info.type.toLowerCase();
 151                             var data = this.toJS();
 152
 153                             if (info.etype == 'events') {
 154                                 data.listeners = data.listeners || { };
 155                                 if (typeof(data.listeners[info.key]) != 'undefined') {
 156                                     return; //already set!
 157                                 }
 158                             } else {
 159                                 if (typeof(data[info.key]) != 'undefined') {
 160                                     return;
 161                                 }
 162                             }
 163
 164                             if (typeof(info.val) == 'undefined') {
 165
 166                                 info.val = '';
 167                                 if (info.type == 'boolean') {
 168                                     info.val = true;
 169                                 }
 170                                 if (type == 'number') {
 171                                     info.val = 0;
 172                                 }
 173                                 // utf8 == string..
 174
 175
 176                             }
 177                             var k = info.key;
 178                             if (info.etype == 'events') {
 179
 180                                 data.listeners[info.key] = info.val;
 181                                 k = '!' + info.key;
 182                             } else {
 183                                 data[info.key] = info.val;
 184                             }
 185
 186
 187                             var map = this.load(data);
 188
 189                             var LeftTree        = imports.Builder.LeftTree.LeftTree;
 190
 191                             LeftTree.get('model').changed(data, true);
 192                             LeftPanel.get('view').selection.select_path(new Gtk.TreePath.from_string(map[k]));
 193                             //this.editSelected( true )
 194                             LeftPanel.get('view').el.set_cursor_on_cell(
 195                                 new Gtk.TreePath.from_string(map[k]),
 196                                 LeftPanel.editableColumn.el,
 197                                 LeftPanel.editableColumn.items[0].el,
 198                                 true);
 199
 200
 201
 202
 203
 204                         },
 205                         deleteSelected : function()
 206                         {
 207                             var data = this.toJS();
 208                             var iter = new Gtk.TreeIter();
 209                             var s = LeftPanel.get('view').selection;
 210                             s.get_selected(this.el, iter);
 211
 212
 213                             var gval = new GObject.Value('');
 214                             LeftPanel.get('model').el.get_value(iter, 0 ,gval);
 215
 216                             var val = gval.value;
 217                             if (val[0] == '!') {
 218                                 // listener..
 219                                 if (!data.listeners || typeof(data.listeners[  val.substring(1)]) == 'undefined') {
 220                                     return;
 221                                 }
 222                                 delete data.listeners[  val.substring(1)];
 223                                 if (!XObject.keys(data.listeners).length) {
 224                                     delete data.listeners;
 225                                 }
 226
 227                             } else {
 228                                 if (typeof(data[val]) == 'undefined') {
 229                                     return;
 230                                 }
 231                                 delete data[val];
 232                             }
 233
 234
 235                             this.load(data);
 236                             var LeftTree        = imports.Builder.LeftTree.LeftTree;
 237                             LeftTree.get('model').changed(data, true);
 238
 239                         },
 240
 241
 242
 243                         activePath : false,
 244                         changed : function(str, doRefresh)
 245                         {
 246                             if (!this.activePath) {
 247                                 return;
 248                             }
 249                             var iter = new Gtk.TreeIter();
 250                             this.el.get_iter(iter, new Gtk.TreePath.from_string(this.activePath));
 251
 252                             this.el.set_value(iter, 1, '' +str);
 253                             this.el.set_value(iter, 3, '' + this.toShort(str));
 254                             // update the tree...
 255                             var LeftTree        = imports.Builder.LeftTree.LeftTree;
 256                             LeftTree.get('model').changed(this.toJS(), doRefresh);
 257                         },
 258                         toJS: function()
 259                         {
 260                             var iter = new Gtk.TreeIter();
 261                             LeftPanel.get('model').el.get_iter_first(iter);
 262                             var ar = {};
 263
 264                             while (true) {
 265
 266                                 var k = this.getValue(iter, 0);
 267                                 Seed.print(k);
 268                                 if (k[0] == '!') {
 269                                     ar.listeners = ar.listeners || {};
 270                                     ar.listeners[  k.substring(1)] = this.getValue(iter, 1);
 271
 272                                 } else {
 273                                     ar[ k ] = this.getValue(iter, 1);
 274                                 }
 275
 276                                 if (! LeftPanel.get('model').el.iter_next(iter)) {
 277                                     break;
 278                                 }
 279                             }
 280                                 Seed.print(JSON.stringify(ar));
 281                             return ar;
 282                             // convert the list into a json string..
 283
 284
 285                         },
 286                         /** get's a value, and tries to use type column to work out what type */
 287                         getValue: function (iter, col) {
 288                             var gval = new GObject.Value('');
 289                             LeftPanel.get('model').el.get_value(iter, col ,gval);
 290                             var val = '' + gval.value;
 291                             if (col != 1) {
 292                                 return val;
 293                             }
 294                             gval = new GObject.Value('');
 295                             LeftPanel.get('model').el.get_value(iter,4  ,gval);
 296                             switch(gval.value) {
 297                                 case 'number':
 298                                     return parseFloat(val);
 299                                 case 'boolean':
 300                                     return val == 'true' ? true : false;
 301                                 default:
 302                                     return val;
 303                             }
 304
 305                         },
 306
 307                         editSelected: function( e)
 308                         {
 309                             print("EDIT SELECTED?");
 310                             var iter = new Gtk.TreeIter();
 311                             var s = LeftPanel.get('view').selection;
 312                             s.get_selected(LeftPanel.get('model').el, iter);
 313                             var m = LeftPanel.get('model');
 314
 315                             var gval = new GObject.Value('');
 316                             this.el.get_value(iter, 0 ,gval);
 317                             var val = '' + gval.value;
 318
 319                             gval = new GObject.Value('');
 320                             this.el.get_value(iter, 1 ,gval);
 321                             var rval = gval.value;
 322                             var activePath = this.el.get_path(iter).to_string();
 323                             this.activePath = activePath ;
 324                             // was activeIter...
 325                             //  not listener...
 326
 327                             var showEditor = false;
 328
 329                             if (val[0] == '!') {
 330                                 showEditor = true;
 331                             }
 332                             if (val[0] == '|') {
 333                                 if (rval.match(/function/g) || rval.match(/\n/g)) {
 334                                     showEditor = true;
 335                                 }
 336                             }
 337
 338                             if (showEditor) {
 339                                 var _this = this;
 340                                 this.activePath = false;
 341                                 GLib.timeout_add(0, 1, function() {
 342                                     //   Gdk.threads_enter();
 343                                     RightEditor.el.show();
 344                                     RightEditor.get('view').load( rval );
 345
 346                                     e.editing_done();
 347                                     e.remove_widget();
 348                                     _this.activePath = activePath ;
 349
 350                              //       Gdk.threads_leave();
 351                                     return false;
 352                                 });
 353                                 return;
 354                             }
 355
 356                             RightEditor.el.hide();
 357
 358                             var type = this.getValue(iter,4);
 359                             print("type = " + type);
 360                             // toggle boolean
 361                             if (type == 'boolean') {
 362                                 val = ! this.getValue(iter,1);
 363
 364                                 this.activePath = false;
 365                                 var _this = this;
 366                                 GLib.timeout_add(0, 1, function() {
 367                                     //   Gdk.threads_enter();
 368
 369                                     e.editing_done();
 370                                     e.remove_widget();
 371                                     _this.activePath = activePath ;
 372                                     _this.changed(''+val,true);
 373
 374
 375                                     return false;
 376                                 });
 377                             }
 378
 379                              // otherwise we are going to show the text editor..
 380
 381
 382                             //r.stop_editing(true);
 383
 384                         }
 385
 386
 387                     },
 388
 389                     {
 390
 391                         xtype: Gtk.TreeViewColumn,
 392                         pack : ['append_column'],
 393                         title : 'key',
 394                         init : function ()
 395                         {
 396                             XObject.prototype.init.call(this);
 397                             this.el.add_attribute(this.items[0].el , 'markup', 2 );
 398
 399                         },
 400                         items : [
 401                             {
 402                                 xtype : Gtk.CellRendererText,
 403                                 pack : ['pack_start'],
 404                             }
 405                         ]
 406                     },
 407
 408                     {
 409
 410                         xtype: Gtk.TreeViewColumn,
 411                         pack : ['append_column'],
 412                         title : 'value',
 413                         init : function ()
 414                         {
 415                             XObject.prototype.init.call(this);
 416                             this.el.add_attribute(this.items[0].el , 'text', 3 );
 417                             LeftPanel.editableColumn= this;
 418                         },
 419                         items : [
 420
 421
 422                             {
 423
 424                                 xtype : Gtk.CellRendererText,
 425                                 pack : ['pack_start'],
 426                                 editable : true,
 427
 428
 429
 430                                 listeners : {
 431
 432                                     edited : function(r,p, t) {
 433                                         LeftPanel.get('model').changed(t, true);
 434                                         LeftPanel.get('model').activePath = false;
 435
 436                                     },
 437
 438                                     'editing-started' : function(r, e, p) {
 439                                         LeftPanel.get('model').editSelected(e);
 440                                     }
 441                                 },
 442
 443                             }
 444                         ]
 445                     }
 446
 447                 ]
 448             }
 449         ]
 450
 451     }
 452 );
 453
 454
 455