extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-27 00:58:55 +01:00
Code Issues Packages Projects Releases Wiki Activity

* Change nextmatch column size calculations so extra size is allocated better.

Browse Source
This commit is contained in:
Nathan Gray 2014-08-19 23:33:06 +00:00
parent ec1471c6d2
commit 28d2fad14a
5 changed files with 65 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
etemplate/js/et2_dataview.js
View File

@ -390,9 +390,9 @@ 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(this.relativeWidth ? (_w / self.columnMgr.totalWidth * 100) + "%" : _w + "px");
self.columnMgr.updated = true;
self.updateColumns();
this.set_width(this.relativeWidth ? (_w / self.columnMgr.totalWidth) : _w + "px");
self.columnMgr.updated = true;
self.updateColumns();
}, enc_column);
// Store both nodes in the columnNodes array

101
etemplate/js/et2_dataview_model_columns.js
View File

@ -59,9 +59,15 @@ var et2_dataview_column = ClassWithAttributes.extend({
"width": {
"name": "Width",
"type": "dimension",
"default": "auto",
"default": "80px",
"description": "Width of the column."
},
"minWidth": {
"name": "Minimum width",
"type": "integer",
"default": 50,
"description": "Minimum width of the column, in pixels. Values below this are rejected."
},
"maxWidth": {
"name": "Maximum width",
"type": "integer",
@ -90,12 +96,16 @@ var et2_dataview_column = ClassWithAttributes.extend({
// 1. "100" => fixedWidth 100px
// 2. "100px" => fixedWidth 100px
// 3. "50%" => relativeWidth 50%
// 4. "auto" => fixedWidth false, relativeWidth false
// 4. 0.5 => relativeWidth 50%
this.relativeWidth = false;
this.fixedWidth = false;
var w = _value;
if (w.charAt(w.length - 1) == "%" && !isNaN(w.substr(0, w.length - 1)))
if (typeof w == 'number')
{
this.relativeWidth = parseFloat(w.toFixed(3));
}
else if (w.charAt(w.length - 1) == "%" && !isNaN(w.substr(0, w.length - 1)))
{
this.relativeWidth = parseInt(w.substr(0, w.length - 1)) / 100;
@ -145,6 +155,7 @@ var et2_dataview_columns = Class.extend({
init: function(_columnData) {
// Initialize some variables
this.totalWidth = 0;
this.totalFixed = 0;
this.columnWidths = [];
// Create the columns object
@ -308,9 +319,8 @@ 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;
var totalRelative = 0;
this.totalFixed = 0;
for (var i = 0; i < this.columns.length; i++)
{
@ -328,72 +338,14 @@ var et2_dataview_columns = Class.extend({
}
if (col.relativeWidth)
{
remRelWidth -= col.relativeWidth;
totalRelative += col.relativeWidth;
}
else if (col.fixedWidth)
{
fixedTotal += col.fixedWidth;
}
else
{
noWidthCount++;
this.totalFixed += col.fixedWidth;
}
}
}
remRelWidth -= fixedTotal / tw;
// Check whether the width of columns with relative width is larger than their
// maxWidth
var done;
do
{
done = true;
var noWidth = remRelWidth / noWidthCount;
for (var i = 0; i < this.columns.length; i++)
{
var col = this.columns[i];
if (col.visibility != ET2_COL_VISIBILITY_INVISIBLE)
{
if (col.maxWidth && !col._larger)
{
if (col.relativeWidth)
{
var w = col.relativeWidth * tw;
col._larger = w > col.maxWidth;
if (col._larger)
{
// Recalculate the remaining relative width:
// col.maxWidth / w is the relative amount of space p which
// is remaining for the element. E.g. an element with
// w = 150px and maxWidth = 100px => p = 2/3
// The space which got removed is 1 - p => 1/3
// ==> we have to add 1/3 * oldRelWidth to the remRelWidth
// variable.
remRelWidth += col.relativeWidth * (1 - col.maxWidth / w);
done = false;
break;
}
}
else
{
col._larger = noWidth * tw > col.maxWidth;
if (col._larger)
{
remRelWidth -= col.maxWidth / tw;
noWidthCount--;
done = false;
break;
}
}
}
}
}
// As some columns take their max width, new space might come available, which
// requires other columns to take their maximum width.
} while (!done);
// Now calculate the absolute width of the columns in pixels
var usedTotal = 0;
@ -414,16 +366,18 @@ var et2_dataview_columns = Class.extend({
}
else if (col.relativeWidth)
{
w = Math.round(tw * col.relativeWidth);
// Reset relative to an actual percentage (of 1.00) or
// resizing eventually sends them to 0
col.relativeWidth = col.relativeWidth / totalRelative;
w = Math.round((tw-this.totalFixed) * col.relativeWidth);
}
else
if (w > tw || (col.maxWidth && w > col.maxWidth))
{
w = Math.round(tw * (remRelWidth / noWidthCount));
w = Math.min(tw - usedTotal, col.maxWidth);
}
if (w < 0)
if (w < 0 || w < col.minWidth)
{
w = 0;
w = Math.max(0, col.minWidth);
}
}
this.columnWidths.push(w);
@ -468,8 +422,7 @@ var et2_dataview_columns = Class.extend({
}
else
{
this.columnWidths[columnIndex] -= remaining_width;
column.set_width(column.relativeWidth ? (this.columnWidths[columnIndex] / self.totalWidth * 100) + "%" : this.columnWidths[columnIndex] + "px");
this.columnWidths[columnIndex] = Math.max(column.minWidth, this.columnWidths[columnIndex] - remaining_width);
}
}
}

7
etemplate/js/et2_dataview_view_resizeable.js
View File

@ -36,7 +36,7 @@
var didResize = false;
var resizeWidth = 0;
function startResize(_outerElem, _elem, _callback)
function startResize(_outerElem, _elem, _callback, _column)
{
if (overlay == null || helper == null)
{
@ -72,7 +72,8 @@
.bind("mousemove", function(e) {
didResize = true;
resizeWidth = Math.max(e.pageX - left + RESIZE_ADD,
RESIZE_MIN_WIDTH);
_column && _column.minWidth ? _column.minWidth : RESIZE_MIN_WIDTH
);
helper.css("width", resizeWidth + "px");
})
@ -126,7 +127,7 @@
// Start the resizing
startResize(outerTable, _elem, function(_w) {
_callback.call(_context, _w);
});
}, _context);
}
});

23
etemplate/js/et2_extension_nextmatch.js
View File

@ -803,7 +803,18 @@ var et2_nextmatch = et2_DOMWidget.extend([et2_IResizeable, et2_IInput],
var colName = this._getColumnName(_row[i].widget);
if(!colName) continue;
if(size[colName]) _colData[i].width = size[colName];
if(size[colName])
{
// Make sure percentages stay percentages, and forget any preference otherwise
if(_colData[i].width.charAt(_colData[i].width.length - 1) == "%")
{
_colData[i].width = typeof size[colName] == 'string' && size[colName].charAt(size[colName].length - 1) == "%" ? size[colName] : _colData[i].width;
}
else
{
_colData[i].width = parseInt(size[colName])+'px';
}
}
for(var j = 0; j < columnDisplay.length; j++)
{
if(columnDisplay[j] == colName)
@ -955,7 +966,15 @@ var et2_nextmatch = et2_DOMWidget.extend([et2_IResizeable, et2_IInput],
"visibility": (!_colData[x] || _colData[x].disabled) ?
ET2_COL_VISIBILITY_INVISIBLE : ET2_COL_VISIBILITY_VISIBLE,
"width": _colData[x] ? _colData[x].width : 0
};
}
if(_colData[x].minWidth)
{
columnData[x].minWidth = _colData[x].minWidth;
}
if(_colData[x].maxWidth)
{
columnData[x].maxWidth = _colData[x].maxWidth;
}
// No action columns in et2
var colName = this._getColumnName(_row[x].widget);

10
etemplate/js/et2_widget_grid.js
View File

@ -180,6 +180,16 @@ var et2_grid = et2_DOMWidget.extend([et2_IDetachedDOM, et2_IAligned],
colDataEntry["class"] = et2_readAttrWithDefault(node, "class", "");
colDataEntry["align"] = et2_readAttrWithDefault(node, "align", "");
colDataEntry["span"] = et2_readAttrWithDefault(node, "span", "1");
// Keep any others attributes set, there's no 'column' widget
for(var i in node.attributes)
{
var attr = node.attributes[i];
if(attr.nodeType == 2 && typeof colDataEntry[attr.nodeName] == 'undefined')
{
colDataEntry[attr.nodeName] = attr.value;
}
}
}
else
{