Hi Jim,
searching for a quick solution then, I met
qx.ui.table.cellrenderer.Conditional (here:
http://c2d/qooxdoo/qooxdoo-0.8.2-sdk/application/demobrowser/build/index.html#table~Table_Conditional.html),
but realized that it didn't meet my use case exactly. So I looked
through the source and copied it according to my table's needs.
Sadly, I had to fix that quickly for a single use, so it's become no
universal tool. You might want to change the approach and create a more
versatile tool of it.
Anyway, my target was to have one table with four rows with numerical
content, row one's cell is colored if its content is != according
(hidden) row four cell's content. Similarly, row two if greater than row
one, row three if smaller that row one.
I recommend to read the source of the class mentioned above to get the
idea; I needed to strip comments here.
Here we go, this is qx0.8.2:
qx.Class.define("abc.BgcolCellRenderer",
{
extend : qx.ui.table.cellrenderer.Default,
construct : function() {
this.base(arguments);
this.numericAllowed = ["==", "!=", ">", "<", ">=", "<="];
this.conditions = [];
},
members :
{
__defaultBackgroundColor : null,
__applyFormatting : function(condition, style)
{
if (condition[2] != null) {
style["background-color"] = condition[2];
}
},
_getContentHtml : function(cellInfo) {
return qx.bom.String.escape(cellInfo.value || "");
},
_getCellClass : function(cellInfo) {
return "qooxdoo-table-cell";
},
addNumericCondition : function(condition, value1, bgcolor,
compare)
{
var temp = null;
if (qx.lang.Array.contains(this.numericAllowed, condition))
{
temp = [condition, bgcolor, value1, compare];
qx.core.Init.getApplication().debug("Method
addNumericCondition
triggered");
}
if (temp != null) {
this.conditions.push(temp);
} else {
throw new Error("Condition not recognized or value is
null!");
}
},
_getCellStyle : function(cellInfo)
{
if (!this.conditions.length)
{
return cellInfo.style || "";
}
var tableModel = cellInfo.table.getTableModel();
var i;
var cond_test;
var compareTarget;
var style =
{
"background-color": this.__defaultBackgroundColor
};
for (i in this.conditions)
{
cond_test = false;
if (qx.lang.Array.contains(this.numericAllowed,
this.conditions[i][0]))
{
if (this.conditions[i][2] == null){
compareSource = Number(cellInfo.value) || 0;
} else {
compareSource = Number(this.conditions[i][2])
|| 0;
}
if (this.conditions[i][3] == null) {
compareTarget = Number(cellInfo.value) || 0;
} else {
compareTarget =
Number(tableModel.getValueById(this.conditions[i][3], cellInfo.row)) || 0;
}
switch(this.conditions[i][0])
{
case "==":
if (compareTarget == compareSource) {
cond_test = true;
// wanna put some debug output here?
}
break;
case "!=":
if (compareTarget != compareSource) {
cond_test = true;
// or here?
}
break;
case ">":
if (compareTarget > compareSource) {
cond_test = true;
}
break;
case "<":
if (compareTarget < compareSource) {
cond_test = true;
}
break;
case ">=":
if (compareTarget >= compareSource) {
cond_test = true;
}
break;
case "<=":
if (compareTarget <= compareSource) {
cond_test = true;
}
break;
}
}
// Apply formatting, if any.
if (cond_test == true) {
style["background-color"] = this.conditions[i][1];
}
}
var styleString = [];
for(var key in style) {
if (style[key]) {
styleString.push(key, ":", style[key], ";");
}
}
return styleString.join("");
}
},
destruct : function() {
}
});
Usage of the cell renderer:
var abc_model = new qx.ui.table.model.Simple();
abc_model.setColumns(["r1", "r2", "r3", "r4"]);
// create three renderers
var abc_val_rend = new abc.BgcolCellRenderer();
var abc_min_rend = new abc.BgcolCellRenderer();
var abc_max_rend = new abc.BgcolCellRenderer();
// argument #4 is the name! of the column to be compared with
// arg #2 not needed here, rest is self explanatory;-)
abc_value_rend.addNumericCondition("!=", null, "yellow", "r4");
abc_min_rend.addNumericCondition("<", null, "red", "r1");
abc_max_rend.addNumericCondition(">", null, "red", "r1");
// assignment uses col no.
abc_table.getTableColumnModel().setDataCellRenderer(0, abc_value_rend);
abc_table.getTableColumnModel().setDataCellRenderer(1, abc_min_rend);
abc_table.getTableColumnModel().setDataCellRenderer(2, abc_max_rend);
Phew!
I hope I can help you with that. Seems like you'll need to have the
comparison fixed to adress your array (see compareSource, compareTarget).
Credits to the author of qx...cellrenderer.Conditional, Dan Hummon.
Same license applies.
One last warning, I haven't tested the renderer with big tables! But I
am pretty sure that it slows down rendering a lot (looking at debug
output in source version [stripped out here] you'll see).
The such colored table is a core part in a software in productive use
since beginning of 2009.
One very last thing, I know, I know: for/in is to act upon objects, not
arrays. Well, I did copy a lot, didn't have much time, you know...
Sorry for the huge post,
greetings
Stefan
(and plz be gentle if you find errors, it's really late here now)
Jim Hunter wrote:
> I think that might help get me over the hump, thanks. For now, that is
> what I am trying to do, change the color of a single cell based on the
> value of an array that is attached to the table. I have the logic
> worked out, and it works fine if I just hack the original source code,
> but for some odd reason the patch does not over-ride the default code.
------------------------------------------------------------------------------
Stay on top of everything new and different, both inside and
around Java (TM) technology - register by April 22, and save
$200 on the JavaOne (SM) conference, June 2-5, 2009, San Francisco.
300 plus technical and hands-on sessions. Register today.
Use priority code J9JMT32. http://p.sf.net/sfu/p
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
