Added sort header click callback, fixed (minor) bug in column width calculation

phpgwapi/js/egw_action/egw_grid.js

@@ -36,6 +36,7 @@ function egwGrid(_parentNode, _columns, _objectManager, _fetchCallback, _columnC
 	this.readQueue = new egwGridDataQueue(_fetchCallback, _context);
 
 	this.selectedChangeCallback = null;
+	this.sortColsCallback = null;
 
 	// Create the root data element
 	this.dataRoot = new egwGridDataElement("", null, this.columns, this.readQueue, 
@@ -61,7 +62,7 @@ function egwGrid(_parentNode, _columns, _objectManager, _fetchCallback, _columnC
 	// the grid outer element will be capable of fetching the root data and
 	// can create a spacer for that.
 	this.gridOuter = new egwGridViewOuter(_parentNode, this.dataRoot,
-		this.selectcolsClick, this.toggleAllClick, this);
+		this.selectcolsClick, this.toggleAllClick, this.sortColsClick, this);
 	this.gridOuter.updateColumns(this.columns.getColumnData());
 }
 
@@ -169,7 +170,10 @@ egwGrid.prototype.selectcolsClick = function(_at)
 			}
 
 			// Call the column change callback with the user data
-			self.columnChangeCallback.call(self.context, set);
+			if (self.columnChangeCallback)
+			{
+				self.columnChangeCallback.call(self.context, set);
+			}
 		}
 
 		self.columns.setColumnVisibilitySet(column_data);
@@ -186,6 +190,21 @@ egwGrid.prototype.toggleAllClick = function(_checked)
 	this.dataRoot.actionObject.toggleAllSelected(_checked);
 }
 
+/**
+ * Handles clicking on a sortable column header
+ */
+egwGrid.prototype.sortColsClick = function(_columnIdx)
+{
+	var col = this.columns.columns[_columnIdx];
+	if (col.sortable == EGW_COL_SORTABLE_EXTERNAL)
+	{
+		if (this.sortColsCallback)
+		{
+			this.sortColsCallback.call(this.context, this.columns.columns[_columnIdx].id);
+		}
+	}
+}
+
 /**
  * Emptys the grid
  */

phpgwapi/js/egw_action/egw_grid_columns.js

@@ -329,7 +329,7 @@ egwGridColumns.prototype._calculateWidths = function()
 	}
 
 	// Remove the spacing between the columns from the total width
-	var tw = this.totalWidth - (this.columns.length - 1) * this.columnSpace;
+	var tw = this.totalWidth - (Math.max(this.getVisibleCount() - 1, 0)) * this.columnSpace;
 
 	// Calculate how many space is - relatively - not occupied with columns with
 	// relative or fixed width

phpgwapi/js/egw_action/egw_grid_view.js

@@ -76,7 +76,8 @@ var EGW_UNIQUE_COUNTER = 0;
  * @param object _data is the data-provider object which contains/loads the grid rows
  * 	and contains their data.
  */
-function egwGridViewOuter(_parentNode, _dataRoot, _selectColsCallback, _toggleAllCallback, _context)
+function egwGridViewOuter(_parentNode, _dataRoot, _selectColsCallback, _toggleAllCallback,
+	_sortColsCallback, _context)
 {
 	this.parentNode = $(_parentNode);
 	this.dataRoot = _dataRoot;
@@ -105,6 +106,7 @@ function egwGridViewOuter(_parentNode, _dataRoot, _selectColsCallback, _toggleAl
 
 	this.headerColumns = [];
 	this.selectColsCallback = _selectColsCallback;
+	this.sortColsCallback = _sortColsCallback;
 	this.toggleAllCallback = _toggleAllCallback;
 	this.context = _context;
 
@@ -364,6 +366,15 @@ egwGridViewOuter.prototype.buildBaseHeader = function()
 				cont.append(sortArrow);
 
 				this.updateColSortmode(i, sortArrow);
+
+				column.click({"self": this, "idx": i}, function(e) {
+					var idx = e.data.idx;
+					var self = e.data.self;
+					if (self.sortColsCallback)
+					{
+						self.sortColsCallback.call(self.context, idx);
+					}
+				});
 			}
 
 			column.append(cont);
@@ -384,9 +395,8 @@ egwGridViewOuter.prototype.buildBaseHeader = function()
 	
 		this.optcol.css("width", this.scrollbarWidth - this.optcol.outerWidth()
 			+ this.optcol.width() + 1);
- 		var self = this;
+		this.optcol.click(this, function(e) {
-		this.optcol.click(function() {
+			e.data.selectColsCallback.call(e.data.context, e.data.selectcols);
-			self.selectColsCallback.call(self.context, self.selectcols);
 
 			return false;
 		});

phpgwapi/js/egw_action/test/test_grid_view.html

@@ -45,23 +45,25 @@
 					{
 						"id": "name",
 						"caption": "Name",
-						"width": "75%",
 						"type": EGW_COL_TYPE_NAME_ICON_FIXED,
 						"sortable": EGW_COL_SORTABLE_EXTERNAL,
 						"sortmode": EGW_COL_SORTMODE_ASC
 					},
 					{
 						"id": "size",
+						"maxWidth": 100,
 						"caption": "Size"
 					},
 					{
 						"id": "rights",
 						"caption": "UNIX Filerights",
+						"maxWidth": 150,
 						"visibility": EGW_COL_VISIBILITY_INVISIBLE
 					},
 					{
 						"id": "mime",
 						"caption": "File-Type/MIME",
+						"maxWidth": 150,
 						"visibility": EGW_COL_VISIBILITY_INVISIBLE
 					},
 					{
@@ -214,7 +216,6 @@
 							data["ctime"] = (new Date).toUTCString();
 							data["owner"] = "as";
 							data["group"] = "stylitedevs";
-							data["check"] = true;
 
 							result.push({
 								"id": _elems[i],
@@ -237,7 +238,7 @@
 				objectManager = new egwActionObjectManager("", actionManager);
 
 				grid = new egwGrid($("#container"), columns, objectManager, fetchDataProc,
-					window);
+					null, window);
 				grid.setActionLinkGroup("folder", listboxFolderLinks);
 				grid.dataRoot.loadData(
 					[