git.pond.sub.org Git - eow/blob - static/dojo-release-1.1.1/dojox/grid/_grid/builder.js

   1 if(!dojo._hasResource["dojox.grid._grid.builder"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
   2 dojo._hasResource["dojox.grid._grid.builder"] = true;
   3 dojo.provide("dojox.grid._grid.builder");
   4 dojo.require("dojox.grid._grid.drag");
   5
   6 dojo.declare("dojox.grid.Builder",
   7         null,
   8         {
   9         // summary:
  10         //              Base class to produce html for grid content.
  11         //              Also provide event decoration, providing grid related information inside the event object
  12         //              passed to grid events.
  13         constructor: function(inView){
  14                 this.view = inView;
  15                 this.grid = inView.grid;
  16         },
  17
  18         view: null,
  19         // boilerplate HTML
  20         _table: '<table class="dojoxGrid-row-table" border="0" cellspacing="0" cellpadding="0" role="wairole:presentation">',
  21
  22         // generate starting tags for a cell
  23         generateCellMarkup: function(inCell, inMoreStyles, inMoreClasses, isHeader){
  24                 var result = [], html;
  25                 if (isHeader){
  26                         html = [ '<th tabIndex="-1" role="wairole:columnheader"' ];
  27                 }else{
  28                         html = [ '<td tabIndex="-1" role="wairole:gridcell"' ];
  29                 }
  30                 inCell.colSpan && html.push(' colspan="', inCell.colSpan, '"');
  31                 inCell.rowSpan && html.push(' rowspan="', inCell.rowSpan, '"');
  32                 html.push(' class="dojoxGrid-cell ');
  33                 inCell.classes && html.push(inCell.classes, ' ');
  34                 inMoreClasses && html.push(inMoreClasses, ' ');
  35                 // result[0] => td opener, style
  36                 result.push(html.join(''));
  37                 // SLOT: result[1] => td classes
  38                 result.push('');
  39                 html = ['" idx="', inCell.index, '" style="'];
  40                 html.push(inCell.styles, inMoreStyles||'');
  41                 inCell.unitWidth && html.push('width:', inCell.unitWidth, ';');
  42                 // result[2] => markup
  43                 result.push(html.join(''));
  44                 // SLOT: result[3] => td style
  45                 result.push('');
  46                 html = [ '"' ];
  47                 inCell.attrs && html.push(" ", inCell.attrs);
  48                 html.push('>');
  49                 // result[4] => td postfix
  50                 result.push(html.join(''));
  51                 // SLOT: result[5] => content
  52                 result.push('');
  53                 // result[6] => td closes
  54                 result.push('</td>');
  55                 return result; // Array
  56         },
  57
  58         // cell finding
  59         isCellNode: function(inNode){
  60                 return Boolean(inNode && inNode.getAttribute && inNode.getAttribute("idx"));
  61         },
  62
  63         getCellNodeIndex: function(inCellNode){
  64                 return inCellNode ? Number(inCellNode.getAttribute("idx")) : -1;
  65         },
  66
  67         getCellNode: function(inRowNode, inCellIndex){
  68                 for(var i=0, row; row=dojox.grid.getTr(inRowNode.firstChild, i); i++){
  69                         for(var j=0, cell; cell=row.cells[j]; j++){
  70                                 if(this.getCellNodeIndex(cell) == inCellIndex){
  71                                         return cell;
  72                                 }
  73                         }
  74                 }
  75         },
  76
  77         findCellTarget: function(inSourceNode, inTopNode){
  78                 var n = inSourceNode;
  79                 while(n && (!this.isCellNode(n) || (dojox.grid.gridViewTag in n.offsetParent.parentNode && n.offsetParent.parentNode[dojox.grid.gridViewTag] != this.view.id)) && (n!=inTopNode)){
  80                         n = n.parentNode;
  81                 }
  82                 return n!=inTopNode ? n : null
  83         },
  84
  85         // event decoration
  86         baseDecorateEvent: function(e){
  87                 e.dispatch = 'do' + e.type;
  88                 e.grid = this.grid;
  89                 e.sourceView = this.view;
  90                 e.cellNode = this.findCellTarget(e.target, e.rowNode);
  91                 e.cellIndex = this.getCellNodeIndex(e.cellNode);
  92                 e.cell = (e.cellIndex >= 0 ? this.grid.getCell(e.cellIndex) : null);
  93         },
  94
  95         // event dispatch
  96         findTarget: function(inSource, inTag){
  97                 var n = inSource;
  98                 while(n && (n!=this.domNode) && (!(inTag in n) || (dojox.grid.gridViewTag in n && n[dojox.grid.gridViewTag] != this.view.id))){
  99                         n = n.parentNode;
 100                 }
 101                 return (n != this.domNode) ? n : null;
 102         },
 103
 104         findRowTarget: function(inSource){
 105                 return this.findTarget(inSource, dojox.grid.rowIndexTag);
 106         },
 107
 108         isIntraNodeEvent: function(e){
 109                 try{
 110                         return (e.cellNode && e.relatedTarget && dojo.isDescendant(e.relatedTarget, e.cellNode));
 111                 }catch(x){
 112                         // e.relatedTarget has permission problem in FF if it's an input: https://bugzilla.mozilla.org/show_bug.cgi?id=208427
 113                         return false;
 114                 }
 115         },
 116
 117         isIntraRowEvent: function(e){
 118                 try{
 119                         var row = e.relatedTarget && this.findRowTarget(e.relatedTarget);
 120                         return !row && (e.rowIndex==-1) || row && (e.rowIndex==row.gridRowIndex);
 121                 }catch(x){
 122                         // e.relatedTarget on INPUT has permission problem in FF: https://bugzilla.mozilla.org/show_bug.cgi?id=208427
 123                         return false;
 124                 }
 125         },
 126
 127         dispatchEvent: function(e){
 128                 if(e.dispatch in this){
 129                         return this[e.dispatch](e);
 130                 }
 131         },
 132
 133         // dispatched event handlers
 134         domouseover: function(e){
 135                 if(e.cellNode && (e.cellNode!=this.lastOverCellNode)){
 136                         this.lastOverCellNode = e.cellNode;
 137                         this.grid.onMouseOver(e);
 138                 }
 139                 this.grid.onMouseOverRow(e);
 140         },
 141
 142         domouseout: function(e){
 143                 if(e.cellNode && (e.cellNode==this.lastOverCellNode) && !this.isIntraNodeEvent(e, this.lastOverCellNode)){
 144                         this.lastOverCellNode = null;
 145                         this.grid.onMouseOut(e);
 146                         if(!this.isIntraRowEvent(e)){
 147                                 this.grid.onMouseOutRow(e);
 148                         }
 149                 }
 150         },
 151
 152         domousedown: function(e){
 153                 if (e.cellNode)
 154                         this.grid.onMouseDown(e);
 155                 this.grid.onMouseDownRow(e)
 156         }
 157
 158 });
 159
 160 dojo.declare("dojox.grid.contentBuilder",
 161         dojox.grid.Builder,
 162         {
 163         // summary:
 164         //              Produces html for grid data content. Owned by grid and used internally
 165         //              for rendering data. Override to implement custom rendering.
 166         update: function(){
 167                 this.prepareHtml();
 168         },
 169
 170         // cache html for rendering data rows
 171         prepareHtml: function(){
 172                 var defaultGet=this.grid.get, rows=this.view.structure.rows;
 173                 for(var j=0, row; (row=rows[j]); j++){
 174                         for(var i=0, cell; (cell=row[i]); i++){
 175                                 cell.get = cell.get || (cell.value == undefined) && defaultGet;
 176                                 cell.markup = this.generateCellMarkup(cell, cell.cellStyles, cell.cellClasses, false);
 177                         }
 178                 }
 179         },
 180
 181         // time critical: generate html using cache and data source
 182         generateHtml: function(inDataIndex, inRowIndex){
 183                 var
 184                         html = [ this._table ],
 185                         v = this.view,
 186                         obr = v.onBeforeRow,
 187                         rows = v.structure.rows;
 188
 189                 obr && obr(inRowIndex, rows);
 190                 for(var j=0, row; (row=rows[j]); j++){
 191                         if(row.hidden || row.header){
 192                                 continue;
 193                         }
 194                         html.push(!row.invisible ? '<tr>' : '<tr class="dojoxGrid-invisible">');
 195                         for(var i=0, cell, m, cc, cs; (cell=row[i]); i++){
 196                                 m = cell.markup, cc = cell.customClasses = [], cs = cell.customStyles = [];
 197                                 // content (format can fill in cc and cs as side-effects)
 198                                 m[5] = cell.format(inDataIndex);
 199                                 // classes
 200                                 m[1] = cc.join(' ');
 201                                 // styles
 202                                 m[3] = cs.join(';');
 203                                 // in-place concat
 204                                 html.push.apply(html, m);
 205                         }
 206                         html.push('</tr>');
 207                 }
 208                 html.push('</table>');
 209                 return html.join(''); // String
 210         },
 211
 212         decorateEvent: function(e){
 213                 e.rowNode = this.findRowTarget(e.target);
 214                 if(!e.rowNode){return false};
 215                 e.rowIndex = e.rowNode[dojox.grid.rowIndexTag];
 216                 this.baseDecorateEvent(e);
 217                 e.cell = this.grid.getCell(e.cellIndex);
 218                 return true; // Boolean
 219         }
 220
 221 });
 222
 223 dojo.declare("dojox.grid.headerBuilder",
 224         dojox.grid.Builder,
 225         {
 226         // summary:
 227         //              Produces html for grid header content. Owned by grid and used internally
 228         //              for rendering data. Override to implement custom rendering.
 229
 230         bogusClickTime: 0,
 231         overResizeWidth: 4,
 232         minColWidth: 1,
 233
 234         // FIXME: isn't this getting mixed from dojox.grid.Builder, -1 character?
 235         _table: '<table class="dojoxGrid-row-table" border="0" cellspacing="0" cellpadding="0" role="wairole:presentation"',
 236
 237         update: function(){
 238                 this.tableMap = new dojox.grid.tableMap(this.view.structure.rows);
 239         },
 240
 241         generateHtml: function(inGetValue, inValue){
 242                 var html = [this._table], rows = this.view.structure.rows;
 243
 244                 // render header with appropriate width, if possible so that views with flex columns are correct height
 245                 if(this.view.viewWidth){
 246                         html.push([' style="width:', this.view.viewWidth, ';"'].join(''));
 247                 }
 248                 html.push('>');
 249                 dojox.grid.fire(this.view, "onBeforeRow", [-1, rows]);
 250                 for(var j=0, row; (row=rows[j]); j++){
 251                         if(row.hidden){
 252                                 continue;
 253                         }
 254                         html.push(!row.invisible ? '<tr>' : '<tr class="dojoxGrid-invisible">');
 255                         for(var i=0, cell, markup; (cell=row[i]); i++){
 256                                 cell.customClasses = [];
 257                                 cell.customStyles = [];
 258                                 markup = this.generateCellMarkup(cell, cell.headerStyles, cell.headerClasses, true);
 259                                 // content
 260                                 markup[5] = (inValue != undefined ? inValue : inGetValue(cell));
 261                                 // styles
 262                                 markup[3] = cell.customStyles.join(';');
 263                                 // classes
 264                                 markup[1] = cell.customClasses.join(' '); //(cell.customClasses ? ' ' + cell.customClasses : '');
 265                                 html.push(markup.join(''));
 266                         }
 267                         html.push('</tr>');
 268                 }
 269                 html.push('</table>');
 270                 return html.join('');
 271         },
 272
 273         // event helpers
 274         getCellX: function(e){
 275                 var x = e.layerX;
 276                 if(dojo.isMoz){
 277                         var n = dojox.grid.ascendDom(e.target, dojox.grid.makeNotTagName("th"));
 278                         x -= (n && n.offsetLeft) || 0;
 279                         var t = e.sourceView.getScrollbarWidth();
 280                         if(!dojo._isBodyLtr() && e.sourceView.headerNode.scrollLeft < t)
 281                                 x -= t;
 282                         //x -= getProp(ascendDom(e.target, mkNotTagName("td")), "offsetLeft") || 0;
 283                 }
 284                 var n = dojox.grid.ascendDom(e.target, function(){
 285                         if(!n || n == e.cellNode){
 286                                 return false;
 287                         }
 288                         // Mozilla 1.8 (FF 1.5) has a bug that makes offsetLeft = -parent border width
 289                         // when parent has border, overflow: hidden, and is positioned
 290                         // handle this problem here ... not a general solution!
 291                         x += (n.offsetLeft < 0 ? 0 : n.offsetLeft);
 292                         return true;
 293                 });
 294                 return x;
 295         },
 296
 297         // event decoration
 298         decorateEvent: function(e){
 299                 this.baseDecorateEvent(e);
 300                 e.rowIndex = -1;
 301                 e.cellX = this.getCellX(e);
 302                 return true;
 303         },
 304
 305         // event handlers
 306         // resizing
 307         prepareResize: function(e, mod){
 308                 var i = dojox.grid.getTdIndex(e.cellNode);
 309                 e.cellNode = (i ? e.cellNode.parentNode.cells[i+mod] : null);
 310                 e.cellIndex = (e.cellNode ? this.getCellNodeIndex(e.cellNode) : -1);
 311                 return Boolean(e.cellNode);
 312         },
 313
 314         canResize: function(e){
 315                 if(!e.cellNode || e.cellNode.colSpan > 1){
 316                         return false;
 317                 }
 318                 var cell = this.grid.getCell(e.cellIndex);
 319                 return !cell.noresize && !cell.isFlex();
 320         },
 321
 322         overLeftResizeArea: function(e){
 323                 if(dojo._isBodyLtr()){
 324                         return (e.cellIndex>0) && (e.cellX < this.overResizeWidth) && this.prepareResize(e, -1);
 325                 }
 326                 return t = e.cellNode && (e.cellX < this.overResizeWidth);
 327         },
 328
 329         overRightResizeArea: function(e){
 330                 if(dojo._isBodyLtr()){
 331                         return e.cellNode && (e.cellX >= e.cellNode.offsetWidth - this.overResizeWidth);
 332                 }
 333                 return (e.cellIndex>0) && (e.cellX >= e.cellNode.offsetWidth - this.overResizeWidth) && this.prepareResize(e, -1);
 334         },
 335
 336         domousemove: function(e){
 337                 //console.log(e.cellIndex, e.cellX, e.cellNode.offsetWidth);
 338                 var c = (this.overRightResizeArea(e) ? 'e-resize' : (this.overLeftResizeArea(e) ? 'w-resize' : ''));
 339                 if(c && !this.canResize(e)){
 340                         c = 'not-allowed';
 341                 }
 342                 e.sourceView.headerNode.style.cursor = c || ''; //'default';
 343                 if (c)
 344                         dojo.stopEvent(e);
 345         },
 346
 347         domousedown: function(e){
 348                 if(!dojox.grid.drag.dragging){
 349                         if((this.overRightResizeArea(e) || this.overLeftResizeArea(e)) && this.canResize(e)){
 350                                 this.beginColumnResize(e);
 351                         }else{
 352                                 this.grid.onMouseDown(e);
 353                                 this.grid.onMouseOverRow(e);
 354                         }
 355                         //else{
 356                         //      this.beginMoveColumn(e);
 357                         //}
 358                 }
 359         },
 360
 361         doclick: function(e) {
 362                 if (new Date().getTime() < this.bogusClickTime) {
 363                         dojo.stopEvent(e);
 364                         return true;
 365                 }
 366         },
 367
 368         // column resizing
 369         beginColumnResize: function(e){
 370                 dojo.stopEvent(e);
 371                 var spanners = [], nodes = this.tableMap.findOverlappingNodes(e.cellNode);
 372                 for(var i=0, cell; (cell=nodes[i]); i++){
 373                         spanners.push({ node: cell, index: this.getCellNodeIndex(cell), width: cell.offsetWidth });
 374                         //console.log("spanner: " + this.getCellNodeIndex(cell));
 375                 }
 376                 var drag = {
 377                         scrollLeft: e.sourceView.headerNode.scrollLeft,
 378                         view: e.sourceView,
 379                         node: e.cellNode,
 380                         index: e.cellIndex,
 381                         w: e.cellNode.clientWidth,
 382                         spanners: spanners
 383                 };
 384                 //console.log(drag.index, drag.w);
 385                 dojox.grid.drag.start(e.cellNode, dojo.hitch(this, 'doResizeColumn', drag), dojo.hitch(this, 'endResizeColumn', drag), e);
 386         },
 387
 388         doResizeColumn: function(inDrag, inEvent){
 389                 var isLtr = dojo._isBodyLtr();
 390                 if(isLtr){
 391                         var w = inDrag.w + inEvent.deltaX;
 392                 }else{
 393                         var w = inDrag.w - inEvent.deltaX;
 394                 }
 395                 if(w >= this.minColWidth){
 396                         for(var i=0, s, sw; (s=inDrag.spanners[i]); i++){
 397                                 if(isLtr){
 398                                         sw = s.width + inEvent.deltaX;
 399                                 }else{
 400                                         sw = s.width - inEvent.deltaX;
 401                                 }
 402                                 s.node.style.width = sw + 'px';
 403                                 inDrag.view.setColWidth(s.index, sw);
 404                                 //console.log('setColWidth', '#' + s.index, sw + 'px');
 405                         }
 406                         inDrag.node.style.width = w + 'px';
 407                         inDrag.view.setColWidth(inDrag.index, w);
 408                         if(!isLtr){
 409                                 inDrag.view.headerNode.scrollLeft = (inDrag.scrollLeft - inEvent.deltaX);
 410                         }
 411                 }
 412                 if(inDrag.view.flexCells && !inDrag.view.testFlexCells()){
 413                         var t = dojox.grid.findTable(inDrag.node);
 414                         t && (t.style.width = '');
 415                 }
 416         },
 417
 418         endResizeColumn: function(inDrag){
 419                 this.bogusClickTime = new Date().getTime() + 30;
 420                 setTimeout(dojo.hitch(inDrag.view, "update"), 50);
 421         }
 422
 423 });
 424
 425 dojo.declare("dojox.grid.tableMap",
 426         null,
 427         {
 428         // summary:
 429         //              Maps an html table into a structure parsable for information about cell row and col spanning.
 430         //              Used by headerBuilder
 431         constructor: function(inRows){
 432                 this.mapRows(inRows);
 433         },
 434
 435         map: null,
 436
 437         mapRows: function(inRows){
 438                 // summary: Map table topography
 439
 440                 //console.log('mapRows');
 441                 // # of rows
 442                 var rowCount = inRows.length;
 443                 if(!rowCount){
 444                         return;
 445                 }
 446                 // map which columns and rows fill which cells
 447                 this.map = [ ];
 448                 for(var j=0, row; (row=inRows[j]); j++){
 449                         this.map[j] = [];
 450                 }
 451                 for(var j=0, row; (row=inRows[j]); j++){
 452                         for(var i=0, x=0, cell, colSpan, rowSpan; (cell=row[i]); i++){
 453                                 while (this.map[j][x]){x++};
 454                                 this.map[j][x] = { c: i, r: j };
 455                                 rowSpan = cell.rowSpan || 1;
 456                                 colSpan = cell.colSpan || 1;
 457                                 for(var y=0; y<rowSpan; y++){
 458                                         for(var s=0; s<colSpan; s++){
 459                                                 this.map[j+y][x+s] = this.map[j][x];
 460                                         }
 461                                 }
 462                                 x += colSpan;
 463                         }
 464                 }
 465                 //this.dumMap();
 466         },
 467
 468         dumpMap: function(){
 469                 for(var j=0, row, h=''; (row=this.map[j]); j++,h=''){
 470                         for(var i=0, cell; (cell=row[i]); i++){
 471                                 h += cell.r + ',' + cell.c + '   ';
 472                         }
 473                         console.log(h);
 474                 }
 475         },
 476
 477         getMapCoords: function(inRow, inCol){
 478                 // summary: Find node's map coords by it's structure coords
 479                 for(var j=0, row; (row=this.map[j]); j++){
 480                         for(var i=0, cell; (cell=row[i]); i++){
 481                                 if(cell.c==inCol && cell.r == inRow){
 482                                         return { j: j, i: i };
 483                                 }
 484                                 //else{console.log(inRow, inCol, ' : ', i, j, " : ", cell.r, cell.c); };
 485                         }
 486                 }
 487                 return { j: -1, i: -1 };
 488         },
 489
 490         getNode: function(inTable, inRow, inCol){
 491                 // summary: Find a node in inNode's table with the given structure coords
 492                 var row = inTable && inTable.rows[inRow];
 493                 return row && row.cells[inCol];
 494         },
 495
 496         _findOverlappingNodes: function(inTable, inRow, inCol){
 497                 var nodes = [];
 498                 var m = this.getMapCoords(inRow, inCol);
 499                 //console.log("node j: %d, i: %d", m.j, m.i);
 500                 var row = this.map[m.j];
 501                 for(var j=0, row; (row=this.map[j]); j++){
 502                         if(j == m.j){ continue; }
 503                         with(row[m.i]){
 504                                 //console.log("overlaps: r: %d, c: %d", r, c);
 505                                 var n = this.getNode(inTable, r, c);
 506                                 if(n){ nodes.push(n); }
 507                         }
 508                 }
 509                 //console.log(nodes);
 510                 return nodes;
 511         },
 512
 513         findOverlappingNodes: function(inNode){
 514                 return this._findOverlappingNodes(dojox.grid.findTable(inNode), dojox.grid.getTrIndex(inNode.parentNode), dojox.grid.getTdIndex(inNode));
 515         }
 516
 517 });
 518
 519 dojox.grid.rowIndexTag = "gridRowIndex";
 520 dojox.grid.gridViewTag = "gridView";
 521
 522 }