Hello Dmitry,
I can't help you with the big-column table, but with the ToolTipTable
(ideas were either from qooxdoo-contrib or they once wandered around in this
forum)
/Peter
Am 8/20/2014 um 2:38 PM schrieb Dmitry A. Golubkov:
> Dear community,
>
> We use Qooxdoo framework for our project P7
> (https://www.datadvance.net/product/pseven/). But for some cases we
> need a table which can works with a huge data (like big-size matrices
> and so on). For now we are using a table widget, but it works very
> slowly when column count more than 50.
>
> Is anybody can help us, and improve qooxdoo table widget to:
> * use huge data (at now it can dynamically load data only for rows,
> but not for columns)
> * show tooltip on mouse over on table cell with using standard qooxdoo
> tooltip component
>
> We are ready to deliver work results absolutely free for the qooxdoo team.
>
> Details of cooperation I am ready to discuss directly by email
> (mas...@hsdesign.ru).
>
> Thanks in advance,
> Dmitry A. Golubkov,
> DATADVANCE
--
** Unsere Veranstaltungen:
Post-Expo in Stockholm, Halle A - Stand A10.05, 23.-25.09.2014
TIS-Hausmesse in Bocholt, 16.10.2014
3. Innovationsforum Telematik, Idstein 28.10.2014
BWVL-Tagung in Köln, 12.-13.11.2014
/**
* Tool Tip Table
*/
qx.Class.define("app.ui.table.ToolTipTable",
{
extend : app.ui.table.Table,
/*
*****************************************************************************
CONSTRUCTOR
*****************************************************************************
*/
/**
* Constructs tool tip table
*
* @param tableModel {Object} table model of table
* @param custom {Map|null} custom implementations
*/
construct: function(tableModel, custom)
{
this.base(arguments, tableModel, custom);
this.__previousCol = -1;
this.__previousRow = -1;
// default -> showTimeout :700, hideTimeout:4000 is ok
this.__tableToolTip = new qx.ui.tooltip.ToolTip;
this.__tableToolTip.setRich(true);
this.setToolTip(this.__tableToolTip);
// Register event listeners/handlers
this.addListener("mousemove", this.__onMousemove, this);
this.addListener("cellOver", this.__onCellOver, this);
},
/*
*****************************************************************************
EVENTS
*****************************************************************************
*/
events :
{
/**
* Dispatched when the mouse is over a cell
*/
"cellOver" : "qx.ui.table.pane.CellEvent",
/**
* Dispatched when the mouse is over a column header.
*/
"headerOver" : "qx.ui.table.pane.CellEvent"
},
/*
*****************************************************************************
PROPERTIES
*****************************************************************************
*/
properties :
{
/**
* List of labels to display.
* labelList[col][row] is displayed when the mouse is over the cell
* located in the column <code>col</code> and in the row <code>row</code>.
*/
labelList :
{
init : new Array(),
check : "Array"
},
/**
* Displayed when no label is set for a particular cell.
* NOTE : Setting to "" will hide the tooltop for the cell you didn't set a
* label
*/
defaultLabel :
{
init : "",
check : "String"
}
},
/*
*****************************************************************************
MEMBERS
*****************************************************************************
*/
members :
{
/** {qx.ui.tooltip.ToolTip} */
__tableToolTip : null,
/** previous column {Integer} */
__previousCol : null,
/** previous row {Integer} */
__previousRow : null,
/*
---------------------------------------------------------------------------
EVENT HANDLER
---------------------------------------------------------------------------
*/
/**
* Will generate the cellOver and headerOver events.
*
* @param e {qx.event.type.Mouse} The event itself.
*/
__onMousemove : function (e)
{
var pageX = e.getDocumentLeft();
var pageY = e.getDocumentTop();
var scroller = this.getTablePaneScrollerAtPageX(pageX);
if (!scroller) {
return;
}
var row = scroller._getRowForPagePos(pageX, pageY);
var col = scroller._getColumnForPageX(pageX);
if (col != this.__previousCol || row != this.__previousRow)
{
var target = e.getTarget();
// Hide tooltip if mouse is not over a row
if (!(target instanceof qx.ui.table.pane.Pane)) {
this.__hideToolTip();
}
// If mouse over a row
else if (typeof(row) === "number" && row > -1)
{
if (target instanceof qx.ui.table.pane.Pane &&
this.hasListener("cellOver") && this.cellExists(col, row)) {
this.fireEvent("cellOver", qx.ui.table.pane.CellEvent, [this, e,
row, col], true);
}
}
this.__previousCol = col;
this.__previousRow = row;
}
},
/**
* Handle the tooltip label change
*
* @param e {qx.ui.table.pane.CellEvent} Self made cell event
* (see {@link #__onMousemove}).
*/
__onCellOver : function (e)
{
var row = e.getRow();
var col = e.getColumn();
var label = this.getCellToolTipLabel(col, row);
// to allow the tooltip to appear again without moving out of the table
qx.ui.tooltip.Manager.getInstance().setCurrent(null);
if ((typeof label === "string") && label!=="")
{
this.__tableToolTip.setLabel(label);
qx.ui.tooltip.Manager.getInstance().setCurrent(this.__tableToolTip);
} else {
qx.ui.tooltip.Manager.getInstance().resetCurrent();
}
},
/**
* Hides table's tooltip.
*/
__hideToolTip : function()
{
this.setToolTip(null);
qx.ui.tooltip.Manager.getInstance().setCurrent(null);
},
/**
* Evaluates if string in column is shown with ellipses,
* it's only a guess, not science!
*
* @param input {String} Input string (from data cell) to evaluate
* @param col {Integer} Column number, needed to get column width
*
* @return {Boolean} <true> if ellipses seems to be is shown, <false>
otherwise
*/
__hasEllipses : function(input, col)
{
var ret = false;
if (typeof(input) === "string" && input.length)
{
var colWidth = this.getTableColumnModel().getColumnWidth(col);
var map = qx.bom.Label.getTextSize(input);
// this seems to work fine
var strWidth = map.width*0.84+14;
if (strWidth>colWidth) {
ret = true;
}
}
return ret;
},
/**
* Determines whether the specified cell exists.
*
* @param col {Integer}
* Cell column.
* @param row {Integer}
* Cell row.
* @return {Boolean}
* <code>true</code> if there is the cell at crossing of
<code>col</code> column and <code>row</code> row,
* otherwise - <code>false</code>.
*/
cellExists : function(col, row)
{
var dataModel = this.getTableModel();
return (typeof(row)==="number" && typeof(col)==="number"
&& 0<=row && row<dataModel.getRowCount()
&& 0<=col && col<dataModel.getColumnCount());
},
/**
* Returns the tooltip label for a particular cell.
* @param col {Integer}
* Cell column.
* @param row {Integer}
* Cell row.
* @return {String}
* The tooltip label for the specified cell.
*/
getCellToolTipLabel : function(col, row)
{
var sResult = "";
if (this.cellExists(col, row))
{
sResult = this.getToolTipLabelFromList(col, row);
if (sResult!==null) {
return sResult;
}
else
{
sResult = this.getTableModel().getValue(col, row);
if (sResult)
{
// stringify all "no-strings"
if (!qx.lang.Type.isString(sResult)) {
sResult = qx.lang.Json.stringify(sResult, null, 2);
}
sResult = qx.bom.String.fromText(sResult); // newline => <br/>
}
if (!this.__hasEllipses(sResult, col)) {
sResult = this.getDefaultLabel();
}
}
}
return sResult;
},
/**
* Returns the label associated to a particular Cell
* from given label list!
*
* @param col {Integer} Cell column
* @param row {Integer} Cell row
* @return {String}
*/
getToolTipLabelFromList : function(col, row)
{
if (row == undefined || col == undefined) {
return null;
}
var labelList = this.getLabelList();
if (labelList[col] == undefined) {
return null;
}
else if (labelList[col][row] == undefined) {
return null;
}
else {
return labelList[col][row];
}
}
},
/*
*****************************************************************************
DESTRUCTOR
*****************************************************************************
*/
destruct : function()
{
this.removeListener("mousemove", this.__onMousemove, this);
this.removeListener("cellOver", this.__onCellOver, this);
this._disposeObjects("__tableToolTip");
}
});
------------------------------------------------------------------------------
Slashdot TV.
Video for Nerds. Stuff that matters.
http://tv.slashdot.org/
_______________________________________________
qooxdoo-devel mailing list
qooxdoo-devel@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel