mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-12-22 23:00:56 +01:00
Better usage for relative column width:
- Columns with relative width specified in template are kept relative in resize - Columns with no width specified in template get any left over space (relative) - Columns with fixed width specified in template are kept fixed These three together mean that if the user resizes the window or adds/removes columns, fixed columns don't change and any space is divided among relative columns.
This commit is contained in:
parent
6e8723361d
commit
29f8a562e2
@ -386,7 +386,7 @@ var et2_dataview = Class.extend({
|
||||
// make column resizable
|
||||
var enc_column = self.columnMgr.getColumnById(col.id);
|
||||
et2_dataview_makeResizeable(column, function(_w) {
|
||||
this.set_width(_w + "px");
|
||||
this.set_width(this.relativeWidth ? (_w / self.columnMgr.totalWidth * 100) + "%" : _w + "px");
|
||||
self.columnMgr.updated = true;
|
||||
self.updateColumns();
|
||||
}, enc_column);
|
||||
|
@ -299,6 +299,7 @@ var et2_dataview_columns = Class.extend({
|
||||
// Calculate how many space is - relatively - not occupied with columns with
|
||||
// relative or fixed width
|
||||
var remRelWidth = 1;
|
||||
var fixedTotal = 0;
|
||||
var noWidthCount = 0;
|
||||
|
||||
for (var i = 0; i < this.columns.length; i++)
|
||||
@ -312,7 +313,7 @@ var et2_dataview_columns = Class.extend({
|
||||
}
|
||||
else if (col.fixedWidth)
|
||||
{
|
||||
remRelWidth -= col.fixedWidth / tw;
|
||||
fixedTotal += col.fixedWidth;
|
||||
}
|
||||
else
|
||||
{
|
||||
@ -320,6 +321,7 @@ var et2_dataview_columns = Class.extend({
|
||||
}
|
||||
}
|
||||
}
|
||||
remRelWidth -= fixedTotal / tw;
|
||||
|
||||
// Check whether the width of columns with relative width is larger than their
|
||||
// maxWidth
|
||||
@ -374,31 +376,6 @@ var et2_dataview_columns = Class.extend({
|
||||
// requires other columns to take their maximum width.
|
||||
} while (!done);
|
||||
|
||||
|
||||
// Check whether the columns where a relative width is specified have more
|
||||
// space than the remaining columns - if yes, make the relative ones larger
|
||||
for (var i = 0; i < this.columns.length; i++)
|
||||
{
|
||||
var col = this.columns[i];
|
||||
|
||||
if (col.visibility != ET2_COL_VISIBILITY_INVISIBLE)
|
||||
{
|
||||
if (col.relativeWidth && !col._larger)
|
||||
{
|
||||
if (col.relativeWidth < noWidth)
|
||||
{
|
||||
noWidthCount++;
|
||||
remRelWidth += col.relativeWidth;
|
||||
col._newWidth = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
col._newWidth = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Now calculate the absolute width of the columns in pixels
|
||||
this.columnWidths = [];
|
||||
for (var i = 0; i < this.columns.length; i++)
|
||||
@ -415,7 +392,7 @@ var et2_dataview_columns = Class.extend({
|
||||
{
|
||||
w = col.fixedWidth;
|
||||
}
|
||||
else if (col.relativeWidth && !col._newWidth)
|
||||
else if (col.relativeWidth)
|
||||
{
|
||||
w = Math.round(tw * col.relativeWidth);
|
||||
}
|
||||
|
@ -154,7 +154,7 @@ var et2_nextmatch = et2_DOMWidget.extend([et2_IResizeable, et2_IInput],
|
||||
|
||||
// Create the dynheight component which dynamically scales the inner
|
||||
// container.
|
||||
this.dynheight = new et2_dynheight(this.egw().window,
|
||||
this.dynheight = new et2_dynheight(this.getInstanceManager().DOMContainer,
|
||||
this.innerDiv, 150);
|
||||
|
||||
// Create the outer grid container
|
||||
@ -707,8 +707,18 @@ var et2_nextmatch = et2_DOMWidget.extend([et2_IResizeable, et2_IInput],
|
||||
}
|
||||
}
|
||||
if(visibility[colMgr.columns[i].id].visible) colDisplay.push(colName);
|
||||
colSize[colName] = colMgr.getColumnWidth(i);
|
||||
} else if (colMgr.columns[i].fixedWidth) {
|
||||
|
||||
// When saving sizes, only save columns with explicit values, preserving relative vs fixed
|
||||
// Others will be left to flex if width changes or more columns are added
|
||||
if(colMgr.columns[i].relativeWidth)
|
||||
{
|
||||
colSize[colName] = (colMgr.columns[i].relativeWidth * 100) + "%";
|
||||
}
|
||||
else if (colMgr.columns[i].fixedWidth)
|
||||
{
|
||||
colSize[colName] = colMgr.columns[i].fixedWidth;
|
||||
}
|
||||
} else if (colMgr.columns[i].fixedWidth || colMgr.columns[i].relativeWidth) {
|
||||
this.egw().debug("info", "Could not save column width - no name", colMgr.columns[i].id);
|
||||
}
|
||||
}
|
||||
@ -814,7 +824,8 @@ var et2_nextmatch = et2_DOMWidget.extend([et2_IResizeable, et2_IInput],
|
||||
// Register handler to update preferences when column properties are changed
|
||||
var self = this;
|
||||
this.dataview.onUpdateColumns = function() {
|
||||
self._updateUserPreferences();
|
||||
// Use apply to make sure context is there
|
||||
self._updateUserPreferences.apply(self);
|
||||
|
||||
// Allow column widgets a chance to resize
|
||||
self.iterateOver(function(widget) {widget.resize();}, self, et2_IResizeable);
|
||||
|
@ -101,6 +101,17 @@ var et2_dynheight = Class.extend(
|
||||
|
||||
// Calculate the new height of the inner container
|
||||
var w = this.innerNode.width();
|
||||
// Some checking to make sure it doesn't overflow the width when user
|
||||
// resizes the window
|
||||
if(w > this.outerNode.width())
|
||||
{
|
||||
w = this.outerNode.width();
|
||||
}
|
||||
if (w > $j(window).width())
|
||||
{
|
||||
// 50px border, totally arbitrary, but we just need to make sure it's inside
|
||||
w = $j(window).width()-50;
|
||||
}
|
||||
var h = Math.max(this.minHeight, oh + ot - it - bh -
|
||||
this.innerMargin - this.outerMargin);
|
||||
this.innerNode.height(h);
|
||||
|
Loading…
Reference in New Issue
Block a user