webapps/qooxdoo-0.6.5-sdk/frontend/framework/source/class/qx/ui/table/AbstractDataCellRenderer.js

   1 /* ************************************************************************
   2
   3    qooxdoo - the new era of web development
   4
   5    http://qooxdoo.org
   6
   7    Copyright:
   8      2006 STZ-IDA, Germany, http://www.stz-ida.de
   9
  10    License:
  11      LGPL: http://www.gnu.org/licenses/lgpl.html
  12      EPL: http://www.eclipse.org/org/documents/epl-v10.php
  13      See the LICENSE file in the project's top-level directory for details.
  14
  15    Authors:
  16      * Til Schneider (til132)
  17
  18 ************************************************************************ */
  19
  20 /* ************************************************************************
  21
  22 #module(ui_table)
  23
  24 ************************************************************************ */
  25
  26 /**
  27  * An abstract data cell renderer that does the basic coloring
  28  * (borders, selected look, ...).
  29  */
  30 qx.OO.defineClass("qx.ui.table.AbstractDataCellRenderer", qx.ui.table.DataCellRenderer,
  31 function() {
  32   qx.ui.table.DataCellRenderer.call(this);
  33 });
  34
  35
  36 // overridden
  37 qx.Proto.createDataCellHtml = function(cellInfo) {
  38   var AbstractDataCellRenderer = qx.ui.table.AbstractDataCellRenderer;
  39   return AbstractDataCellRenderer.MAIN_DIV_START + this._getCellStyle(cellInfo)
  40     + AbstractDataCellRenderer.MAIN_DIV_START_END
  41     + this._getContentHtml(cellInfo) + AbstractDataCellRenderer.MAIN_DIV_END;
  42 }
  43
  44
  45 // overridden
  46 qx.Proto.updateDataCellElement = function(cellInfo, cellElement) {
  47   cellElement.innerHTML = this._getContentHtml(cellInfo);
  48 }
  49
  50
  51 /**
  52  * Returns the CSS styles that should be applied to the main div of this cell.
  53  *
  54  * @param cellInfo {Map} The information about the cell.
  55  *        See {@link #createDataCellHtml}.
  56  * @return the CSS styles of the main div.
  57  */
  58 qx.Proto._getCellStyle = function(cellInfo) {
  59   return cellInfo.style + qx.ui.table.AbstractDataCellRenderer.MAIN_DIV_STYLE;
  60 }
  61
  62
  63 /**
  64  * Returns the HTML that should be used inside the main div of this cell.
  65  *
  66  * @param cellInfo {Map} The information about the cell.
  67  *        See {@link #createDataCellHtml}.
  68  * @return {String} the inner HTML of the main div.
  69  */
  70 qx.Proto._getContentHtml = function(cellInfo) {
  71   return cellInfo.value;
  72 }
  73
  74
  75 qx.Proto.createDataCellHtml_array_join = function(cellInfo, htmlArr) {
  76   var AbstractDataCellRenderer = qx.ui.table.AbstractDataCellRenderer;
  77
  78   if (qx.ui.table.TablePane.USE_TABLE) {
  79     htmlArr.push(AbstractDataCellRenderer.TABLE_TD);
  80     htmlArr.push(cellInfo.styleHeight);
  81     htmlArr.push("px");
  82   } else {
  83     htmlArr.push(AbstractDataCellRenderer.ARRAY_JOIN_MAIN_DIV_LEFT);
  84     htmlArr.push(cellInfo.styleLeft);
  85     htmlArr.push(AbstractDataCellRenderer.ARRAY_JOIN_MAIN_DIV_WIDTH);
  86     htmlArr.push(cellInfo.styleWidth);
  87     htmlArr.push(AbstractDataCellRenderer.ARRAY_JOIN_MAIN_DIV_HEIGHT);
  88     htmlArr.push(cellInfo.styleHeight);
  89     htmlArr.push("px");
  90   }
  91
  92   this._createCellStyle_array_join(cellInfo, htmlArr);
  93
  94   htmlArr.push(AbstractDataCellRenderer.ARRAY_JOIN_MAIN_DIV_START_END);
  95
  96   this._createContentHtml_array_join(cellInfo, htmlArr);
  97
  98   if (qx.ui.table.TablePane.USE_TABLE) {
  99     htmlArr.push(AbstractDataCellRenderer.TABLE_TD_END);
 100   } else {
 101     htmlArr.push(AbstractDataCellRenderer.ARRAY_JOIN_MAIN_DIV_END);
 102   }
 103 }
 104
 105
 106 qx.Proto._createCellStyle_array_join = function(cellInfo, htmlArr) {
 107   htmlArr.push(qx.ui.table.AbstractDataCellRenderer.MAIN_DIV_STYLE);
 108 }
 109
 110
 111 qx.Proto._createContentHtml_array_join = function(cellInfo, htmlArr) {
 112   htmlArr.push(cellInfo.value);
 113 }
 114
 115
 116 qx.Class.MAIN_DIV_START = '<div style="';
 117 qx.Class.MAIN_DIV_START_END = '">';
 118 qx.Class.MAIN_DIV_END = '</div>';
 119 /** main style */
 120 qx.Class.MAIN_DIV_STYLE = ';overflow:hidden;white-space:nowrap;border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;padding-left:2px;padding-right:2px;cursor:default'
 121   + (qx.core.Client.getInstance().isMshtml() ? '' : ';-moz-user-select:none;');
 122
 123 qx.Class.ARRAY_JOIN_MAIN_DIV_LEFT = '<div style="position:absolute;left:';
 124 qx.Class.ARRAY_JOIN_MAIN_DIV_WIDTH = 'px;top:0px;width:';
 125 qx.Class.ARRAY_JOIN_MAIN_DIV_HEIGHT = 'px;height:';
 126 qx.Class.ARRAY_JOIN_MAIN_DIV_START_END = '">';
 127 qx.Class.ARRAY_JOIN_MAIN_DIV_END = '</div>';
 128
 129 qx.Class.TABLE_TD = '<td style="height:';
 130 qx.Class.TABLE_TD_END = '</td>';