Open-ILS/xul/staff_client/chrome/content/util/list.js

   1 dump('entering util.list.js\n');
   2
   3 if (typeof main == 'undefined') main = {};
   4 util.list = function (id) {
   5
   6         this.node = document.getElementById(id);
   7
   8         if (!this.node) throw('Could not find element ' + id);
   9         switch(this.node.nodeName) {
  10                 case 'listbox' :
  11                 case 'tree' : break;
  12                 case 'richlistbox' :
  13                         throw(this.node.nodeName + ' not yet supported'); break;
  14                 default: throw(this.node.nodeName + ' not supported'); break;
  15         }
  16
  17         JSAN.use('util.error'); this.error = new util.error();
  18
  19         return this;
  20 };
  21
  22 util.list.prototype = {
  23
  24         'init' : function (params) {
  25
  26                 JSAN.use('util.widgets');
  27
  28                 if (typeof params.map_row_to_column == 'function') this.map_row_to_column = params.map_row_to_column;
  29                 if (typeof params.retrieve_row == 'function') this.retrieve_row = params.retrieve_row;
  30
  31                 this.prebuilt = false;
  32                 if (typeof params.prebuilt != 'undefined') this.prebuilt = params.prebuilt;
  33
  34                 if (typeof params.columns == 'undefined') throw('util.list.init: No columns');
  35                 this.columns = params.columns;
  36
  37                 switch(this.node.nodeName) {
  38                         case 'tree' : this._init_tree(params); break;
  39                         case 'listbox' : this._init_listbox(params); break;
  40                         default: throw('NYI: Need ._init() for ' + this.node.nodeName); break;
  41                 }
  42         },
  43
  44         '_init_tree' : function (params) {
  45                 var obj = this;
  46                 if (this.prebuilt) {
  47
  48                         this.treechildren = this.node.lastChild;
  49
  50                 } else {
  51                         var treecols = document.createElement('treecols');
  52                         this.node.appendChild(treecols);
  53
  54                         for (var i = 0; i < this.columns.length; i++) {
  55                                 var treecol = document.createElement('treecol');
  56                                 for (var j in this.columns[i]) {
  57                                         treecol.setAttribute(j,this.columns[i][j]);
  58                                 }
  59                                 treecols.appendChild(treecol);
  60                                 var splitter = document.createElement('splitter');
  61                                 splitter.setAttribute('class','tree-splitter');
  62                                 treecols.appendChild(splitter);
  63                         }
  64
  65                         var treechildren = document.createElement('treechildren');
  66                         this.node.appendChild(treechildren);
  67                         this.treechildren = treechildren;
  68                 }
  69                 if (typeof params.on_select == 'function') {
  70                         this.node.addEventListener(
  71                                 'select',
  72                                 params.on_select,
  73                                 false
  74                         );
  75                 }
  76                 if (typeof params.on_click == 'function') {
  77                         this.node.addEventListener(
  78                                 'click',
  79                                 params.on_click,
  80                                 false
  81                         );
  82                 }
  83                 /*
  84                 this.node.addEventListener(
  85                         'mousemove',
  86                         function(ev) { obj.detect_visible(); },
  87                         false
  88                 );
  89                 */
  90                 this.node.addEventListener(
  91                         'keypress',
  92                         function(ev) { obj.auto_retrieve(); },
  93                         false
  94                 );
  95                 this.node.addEventListener(
  96                         'click',
  97                         function(ev) { obj.auto_retrieve(); },
  98                         false
  99                 );
 100                 window.addEventListener(
 101                         'resize',
 102                         function(ev) { obj.auto_retrieve(); },
 103                         false
 104                 );
 105                 /* FIXME -- find events on scrollbar to trigger this */
 106                 //obj.detect_visible_polling();
 107                 /*
 108                 var scrollbar = document.getAnonymousNodes( document.getAnonymousNodes(this.node)[1] )[1];
 109                 var slider = document.getAnonymousNodes( scrollbar )[2];
 110                 alert('scrollbar = ' + scrollbar.nodeName + ' grippy = ' + slider.nodeName);
 111                 scrollbar.addEventListener('click',function(){alert('sb click');},false);
 112                 scrollbar.addEventListener('command',function(){alert('sb command');},false);
 113                 scrollbar.addEventListener('scroll',function(){alert('sb scroll');},false);
 114                 slider.addEventListener('click',function(){alert('slider click');},false);
 115                 slider.addEventListener('command',function(){alert('slider command');},false);
 116                 slider.addEventListener('scroll',function(){alert('slider scroll');},false);
 117                 */
 118                 this.node.addEventListener('scroll',function(){ obj.auto_retrieve(); },false);
 119         },
 120
 121         '_init_listbox' : function (params) {
 122                 if (this.prebuilt) {
 123                 } else {
 124                         var listhead = document.createElement('listhead');
 125                         this.node.appendChild(listhead);
 126
 127                         var listcols = document.createElement('listcols');
 128                         this.node.appendChild(listcols);
 129
 130                         for (var i = 0; i < this.columns.length; i++) {
 131                                 var listheader = document.createElement('listheader');
 132                                 listhead.appendChild(listheader);
 133                                 var listcol = document.createElement('listcol');
 134                                 listcols.appendChild(listcol);
 135                                 for (var j in this.columns[i]) {
 136                                         listheader.setAttribute(j,this.columns[i][j]);
 137                                         listcol.setAttribute(j,this.columns[i][j]);
 138                                 };
 139                         }
 140                 }
 141         },
 142
 143         'clear' : function (params) {
 144                 switch (this.node.nodeName) {
 145                         case 'tree' : this._clear_tree(params); break;
 146                         case 'listbox' : this._clear_listbox(params); break;
 147                         default: throw('NYI: Need .clear() for ' + this.node.nodeName); break;
 148                 }
 149                 this.error.sdump('D_LIST','Clearing list ' + this.node.getAttribute('id') + '\n');
 150         },
 151
 152         '_clear_tree' : function(params) {
 153                 var obj = this;
 154                 if (obj.error.sdump_levels.D_LIST_DUMP_ON_CLEAR) {
 155                         obj.error.sdump('D_LIST_DUMP_ON_CLEAR',obj.dump());
 156                 }
 157                 if (obj.error.sdump_levels.D_LIST_DUMP_WITH_KEYS_ON_CLEAR) {
 158                         obj.error.sdump('D_LIST_DUMP_WITH_KEYS_ON_CLEAR',obj.dump_with_keys());
 159                 }
 160                 while (obj.treechildren.lastChild) obj.treechildren.removeChild( obj.treechildren.lastChild );
 161         },
 162
 163         '_clear_listbox' : function(params) {
 164                 var items = [];
 165                 var nl = this.node.getElementsByTagName('listitem');
 166                 for (var i = 0; i < nl.length; i++) {
 167                         items.push( nl[i] );
 168                 }
 169                 for (var i = 0; i < items.length; i++) {
 170                         this.node.removeChild(items[i]);
 171                 }
 172         },
 173
 174         'append' : function (params) {
 175                 var rnode;
 176                 switch (this.node.nodeName) {
 177                         case 'tree' : rnode = this._append_to_tree(params); break;
 178                         case 'listbox' : rnode = this._append_to_listbox(params); break;
 179                         default: throw('NYI: Need .append() for ' + this.node.nodeName); break;
 180                 }
 181                 if (rnode && params.attributes) {
 182                         for (var i in params.attributes) {
 183                                 rnode.setAttribute(i,params.attributes[i]);
 184                         }
 185                 }
 186                 return rnode;
 187         },
 188
 189         '_append_to_tree' : function (params) {
 190
 191                 var obj = this;
 192
 193                 if (typeof params.row == 'undefined') throw('util.list.append: Object must contain a row');
 194
 195                 var s = ('util.list.append: params = ' + (params) + '\n');
 196
 197                 var treechildren_node = this.treechildren;
 198
 199                 if (params.node && params.node.nodeName == 'treeitem') {
 200                         params.node.setAttribute('container','true'); /* params.node.setAttribute('open','true'); */
 201                         if (params.node.lastChild.nodeName == 'treechildren') {
 202                                 treechildren_node = params.node.lastChild;
 203                         } else {
 204                                 treechildren_node = document.createElement('treechildren');
 205                                 params.node.appendChild(treechildren_node);
 206                         }
 207                 }
 208
 209                 var treeitem = document.createElement('treeitem');
 210                 treeitem.setAttribute('retrieve_id',params.retrieve_id);
 211                 treechildren_node.appendChild( treeitem );
 212                 var treerow = document.createElement('treerow');
 213                 treeitem.appendChild( treerow );
 214
 215                 s += ('tree = ' + this.node + '  treechildren = ' + treechildren_node + '\n');
 216                 s += ('treeitem = ' + treeitem + '  treerow = ' + treerow + '\n');
 217
 218                 if (typeof params.retrieve_row == 'function' || typeof this.retrieve_row == 'function') {
 219
 220                         treerow.setAttribute('retrieve_id',params.retrieve_id);
 221                         obj.put_retrieving_label(treerow);
 222                         treerow.addEventListener(
 223                                 'flesh',
 224                                 function() {
 225                                         //dump('fleshing = ' + params.retrieve_id + '\n');
 226
 227                                         params.row_node = treeitem;
 228                                         params.on_retrieve = function(p) {
 229                                                 try {
 230                                                         p.row = params.row;
 231                                                         obj._map_row_to_treecell(p,treerow);
 232                                                 } catch(E) {
 233                                                         alert('fixme2: ' + E);
 234                                                 }
 235                                         }
 236
 237                                         if (typeof params.retrieve_row == 'function') {
 238
 239                                                 params.retrieve_row( params );
 240
 241                                         } else {
 242
 243                                                 if (typeof obj.retrieve_row == 'function') {
 244
 245                                                         obj.retrieve_row( params );
 246
 247                                                 }
 248                                         }
 249
 250                                         treerow.setAttribute('retrieved','true');
 251                                 },
 252                                 false
 253                         );
 254                         /*
 255                         setTimeout(
 256                                 function() {
 257                                         util.widgets.dispatch('flesh',treerow);
 258                                 }, 0
 259                         );
 260                         */
 261                 } else {
 262                         obj.put_retrieving_label(treerow);
 263                         treerow.addEventListener(
 264                                 'flesh',
 265                                 function() {
 266                                         //dump('fleshing anon\n');
 267                                         obj._map_row_to_treecell(params,treerow);
 268                                         treerow.setAttribute('retrieved','true');
 269                                 },
 270                                 false
 271                         );
 272                         /*
 273                         setTimeout(
 274                                 function() {
 275                                         util.widgets.dispatch('flesh',treerow);
 276                                 }, 0
 277                         );
 278                         */
 279                 }
 280                 this.error.sdump('D_LIST',s);
 281
 282                 setTimeout( function() { obj.auto_retrieve(); }, 0 );
 283
 284                 return treeitem;
 285         },
 286
 287         'put_retrieving_label' : function(treerow) {
 288                 var obj = this;
 289                 try {
 290                         /*
 291                         var cols_idx = 0;
 292                         dump('put_retrieving_label.  columns = ' + js2JSON(obj.columns) + '\n');
 293                         while( obj.columns[cols_idx] && obj.columns[cols_idx].hidden && obj.columns[cols_idx].hidden == 'true') {
 294                                 dump('\t' + cols_idx);
 295                                 var treecell = document.createElement('treecell');
 296                                 treerow.appendChild(treecell);
 297                                 cols_idx++;
 298                         }
 299                         */
 300                         for (var i = 0; i < obj.columns.length; i++) {
 301                         var treecell = document.createElement('treecell'); treecell.setAttribute('label','Retrieving...');
 302                         treerow.appendChild(treecell);
 303                         }
 304                         /*
 305                         dump('\t' + cols_idx + '\n');
 306                         */
 307                 } catch(E) {
 308                         alert(E);
 309                 }
 310         },
 311
 312         'detect_visible' : function() {
 313                 try {
 314                         var obj = this;
 315                         //dump('detect_visible  obj.node = ' + obj.node + '\n');
 316                         /* FIXME - this is a hack.. if the implementation of tree changes, this could break */
 317                         var scrollbar = document.getAnonymousNodes( document.getAnonymousNodes(obj.node)[1] )[1];
 318                         var curpos = scrollbar.getAttribute('curpos');
 319                         var maxpos = scrollbar.getAttribute('maxpos');
 320                         //alert('curpos = ' + curpos + ' maxpos = ' + maxpos + ' obj.curpos = ' + obj.curpos + ' obj.maxpos = ' + obj.maxpos + '\n');
 321                         if ((curpos != obj.curpos) || (maxpos != obj.maxpos)) {
 322                                 if ( obj.auto_retrieve() > 0 ) {
 323                                         obj.curpos = curpos; obj.maxpos = maxpos;
 324                                 }
 325                         }
 326                 } catch(E) { alert(E); }
 327         },
 328
 329         'detect_visible_polling' : function() {
 330                 try {
 331                         //alert('detect_visible_polling');
 332                         var obj = this;
 333                         obj.detect_visible();
 334                         setTimeout(function() { try { obj.detect_visible_polling(); } catch(E) { alert(E); } },2000);
 335                 } catch(E) {
 336                         alert(E);
 337                 }
 338         },
 339
 340         'auto_retrieve' : function () {
 341                 var obj = this;
 342                 if (!obj.auto_retrieve_in_progress) {
 343                         obj.auto_retrieve_in_progress = true;
 344                         setTimeout(
 345                                 function() {
 346                                         try {
 347                                                         //alert('auto_retrieve\n');
 348                                                         var count = 0;
 349                                                         var startpos = obj.node.treeBoxObject.getFirstVisibleRow();
 350                                                         var endpos = obj.node.treeBoxObject.getLastVisibleRow();
 351                                                         if (startpos > endpos) endpos = obj.node.treeBoxObject.getPageLength();
 352                                                         //dump('startpos = ' + startpos + ' endpos = ' + endpos + '\n');
 353                                                         for (var i = startpos; i < endpos + 2; i++) {
 354                                                                 try {
 355                                                                         //dump('trying index ' + i + '\n');
 356                                                                         var item = obj.node.contentView.getItemAtIndex(i).firstChild;
 357                                                                         if (item && item.getAttribute('retrieved') != 'true' ) {
 358                                                                                 //dump('\tgot an unfleshed item = ' + item + ' = ' + item.nodeName + '\n');
 359                                                                                 util.widgets.dispatch('flesh',item); count++;
 360                                                                         }
 361                                                                 } catch(E) {
 362                                                                         //dump(i + ' : ' + E + '\n');
 363                                                                 }
 364                                                         }
 365                                                         obj.auto_retrieve_in_progress = false;
 366                                                         return count;
 367                                         } catch(E) { alert(E); }
 368                                 }, 1
 369                         );
 370                 }
 371         },
 372
 373         '_append_to_listbox' : function (params) {
 374
 375                 var obj = this;
 376
 377                 if (typeof params.row == 'undefined') throw('util.list.append: Object must contain a row');
 378
 379                 var s = ('util.list.append: params = ' + (params) + '\n');
 380
 381                 var listitem = document.createElement('listitem');
 382
 383                 s += ('listbox = ' + this.node + '  listitem = ' + listitem + '\n');
 384
 385                 if (typeof params.retrieve_row == 'function' || typeof this.retrieve_row == 'function') {
 386
 387                         setTimeout(
 388                                 function() {
 389                                         listitem.setAttribute('retrieve_id',params.retrieve_id);
 390                                         //FIXME//Make async and fire when row is visible in list
 391                                         var row;
 392
 393                                         params.row_node = listitem;
 394                                         params.on_retrieve = function(row) {
 395                                                 params.row = row;
 396                                                 obj._map_row_to_listcell(params,listitem);
 397                                                 obj.node.appendChild( listitem );
 398                                         }
 399
 400                                         if (typeof params.retrieve_row == 'function') {
 401
 402                                                 row = params.retrieve_row( params );
 403
 404                                         } else {
 405
 406                                                 if (typeof obj.retrieve_row == 'function') {
 407
 408                                                         row = obj.retrieve_row( params );
 409
 410                                                 }
 411                                         }
 412                                 }, 0
 413                         );
 414                 } else {
 415                         this._map_row_to_listcell(params,listitem);
 416                         this.node.appendChild( listitem );
 417                 }
 418
 419                 this.error.sdump('D_LIST',s);
 420                 return listitem;
 421
 422         },
 423
 424         '_map_row_to_treecell' : function(params,treerow) {
 425                 var s = '';
 426                 util.widgets.remove_children(treerow);
 427                 for (var i = 0; i < this.columns.length; i++) {
 428                         var treecell = document.createElement('treecell');
 429                         var label = '';
 430                         if (params.skip_columns && (params.skip_columns.indexOf(i) != -1)) {
 431                                 treecell.setAttribute('label',label);
 432                                 treerow.appendChild( treecell );
 433                                 s += ('treecell = ' + treecell + ' with label = ' + label + '\n');
 434                                 continue;
 435                         }
 436                         if (params.skip_all_columns_except && (params.skip_all_columns_except.indexOf(i) == -1)) {
 437                                 treecell.setAttribute('label',label);
 438                                 treerow.appendChild( treecell );
 439                                 s += ('treecell = ' + treecell + ' with label = ' + label + '\n');
 440                                 continue;
 441                         }
 442                         if (typeof params.map_row_to_column == 'function')  {
 443
 444                                 label = params.map_row_to_column(params.row,this.columns[i]);
 445
 446                         } else {
 447
 448                                 if (typeof this.map_row_to_column == 'function') {
 449
 450                                         label = this.map_row_to_column(params.row,this.columns[i]);
 451
 452                                 } else {
 453
 454                                         throw('No map_row_to_column function');
 455
 456                                 }
 457                         }
 458                         treecell.setAttribute('label',label);
 459                         treerow.appendChild( treecell );
 460                         s += ('treecell = ' + treecell + ' with label = ' + label + '\n');
 461                 }
 462                 this.error.sdump('D_LIST',s);
 463         },
 464
 465         '_map_row_to_listcell' : function(params,listitem) {
 466                 var s = '';
 467                 for (var i = 0; i < this.columns.length; i++) {
 468                         var value = '';
 469                         if (typeof params.map_row_to_column == 'function')  {
 470
 471                                 value = params.map_row_to_column(params.row,this.columns[i]);
 472
 473                         } else {
 474
 475                                 if (typeof this.map_row_to_column == 'function') {
 476
 477                                         value = this.map_row_to_column(params.row,this.columns[i]);
 478                                 }
 479                         }
 480                         if (typeof value == 'string' || typeof value == 'number') {
 481                                 var listcell = document.createElement('listcell');
 482                                 listcell.setAttribute('label',value);
 483                                 listitem.appendChild(listcell);
 484                                 s += ('listcell = ' + listcell + ' with label = ' + value + '\n');
 485                         } else {
 486                                 listitem.appendChild(value);
 487                                 s += ('listcell = ' + value + ' is really a ' + value.nodeName + '\n');
 488                         }
 489                 }
 490                 this.error.sdump('D_LIST',s);
 491         },
 492
 493         'retrieve_selection' : function(params) {
 494                 switch(this.node.nodeName) {
 495                         case 'tree' : return this._retrieve_selection_from_tree(params); break;
 496                         default: throw('NYI: Need ._retrieve_selection_from_() for ' + this.node.nodeName); break;
 497                 }
 498         },
 499
 500         '_retrieve_selection_from_tree' : function(params) {
 501                 var list = [];
 502                 var start = new Object();
 503                 var end = new Object();
 504                 var numRanges = this.node.view.selection.getRangeCount();
 505                 for (var t=0; t<numRanges; t++){
 506                         this.node.view.selection.getRangeAt(t,start,end);
 507                         for (var v=start.value; v<=end.value; v++){
 508                                 var i = this.node.contentView.getItemAtIndex(v);
 509                                 list.push( i );
 510                         }
 511                 }
 512                 return list;
 513         },
 514
 515         'dump' : function(params) {
 516                 switch(this.node.nodeName) {
 517                         case 'tree' : return this._dump_tree(params); break;
 518                         default: throw('NYI: Need .dump() for ' + this.node.nodeName); break;
 519                 }
 520         },
 521
 522         '_dump_tree' : function(params) {
 523                 var dump = [];
 524                 for (var i = 0; i < this.treechildren.childNodes.length; i++) {
 525                         var row = [];
 526                         var treeitem = this.treechildren.childNodes[i];
 527                         var treerow = treeitem.firstChild;
 528                         for (var j = 0; j < treerow.childNodes.length; j++) {
 529                                 row.push( treerow.childNodes[j].getAttribute('label') );
 530                         }
 531                         dump.push( row );
 532                 }
 533                 return dump;
 534         },
 535
 536         'dump_with_keys' : function(params) {
 537                 switch(this.node.nodeName) {
 538                         case 'tree' : return this._dump_tree_with_keys(params); break;
 539                         default: throw('NYI: Need .dump_with_keys() for ' + this.node.nodeName); break;
 540                 }
 541
 542         },
 543
 544         '_dump_tree_with_keys' : function(params) {
 545                 var obj = this;
 546                 var dump = [];
 547                 for (var i = 0; i < this.treechildren.childNodes.length; i++) {
 548                         var row = {};
 549                         var treeitem = this.treechildren.childNodes[i];
 550                         var treerow = treeitem.firstChild;
 551                         for (var j = 0; j < treerow.childNodes.length; j++) {
 552                                 row[ obj.columns[j].id ] = treerow.childNodes[j].getAttribute('label');
 553                         }
 554                         dump.push( row );
 555                 }
 556                 return dump;
 557         },
 558
 559         'dump_retrieve_ids' : function(params) {
 560                 switch(this.node.nodeName) {
 561                         case 'tree' : return this._dump_retrieve_ids_tree(params); break;
 562                         default: throw('NYI: Need .dump_retrieve_ids() for ' + this.node.nodeName); break;
 563                 }
 564         },
 565
 566         '_dump_retrieve_ids_tree' : function(params) {
 567                 var dump = [];
 568                 for (var i = 0; i < this.treechildren.childNodes.length; i++) {
 569                         var treeitem = this.treechildren.childNodes[i];
 570                         dump.push( treeitem.getAttribute('retrieve_id') );
 571                 }
 572                 return dump;
 573         },
 574
 575 }
 576 dump('exiting util.list.js\n');