mirror of
https://github.com/EGroupware/egroupware.git
synced 2025-08-16 11:38:02 +02:00
First version of the dataview which does... well... 'something' at least (currently shows dummy rows with non-etemplate content) Need to cleanup code and test auto hiding of rows (code is actually there)
This commit is contained in:
@ -13,24 +13,236 @@
|
||||
"use strict";
|
||||
|
||||
/*egw:uses
|
||||
jquery.jquery;
|
||||
et2_core_common;
|
||||
et2_dataview_interfaces;
|
||||
et2_dataview_view_row;
|
||||
et2_dataview_view_partitionTree;
|
||||
*/
|
||||
|
||||
var et2_dataview_grid = Class.extend({
|
||||
var et2_dataview_grid = Class.extend(et2_dataview_IViewRange, {
|
||||
|
||||
/**
|
||||
* Creates the grid.
|
||||
*
|
||||
* @param _parent is the parent grid class - if null, this means that this
|
||||
* is the outer grid which manages the scrollarea. If not null, all other
|
||||
* parameters are ignored and copied from the given grid instance.
|
||||
* @param _outerId is the id of the grid container it uses for the css
|
||||
* classes.
|
||||
* @param _columnIds is the id of the individual columns used for the css
|
||||
* classes.
|
||||
* @param _avgHeight is the starting average height of the column rows.
|
||||
*/
|
||||
init: function(_parent, _outerId, _columnIds, _dataProvider, _avgHeight) {
|
||||
|
||||
// If the parent is given, copy all other parameters from it
|
||||
if (_parent != null)
|
||||
{
|
||||
this._outerId = _parent._outerId;
|
||||
this._columnIds = _parent._columnIds;
|
||||
this._dataProvider = _parent._dataProvider;
|
||||
this._avgHeight = _parent._partitionTree.getAverageHeight();
|
||||
this._rowProvider = _parent._rowProvider;
|
||||
}
|
||||
else
|
||||
{
|
||||
// Otherwise copy the given parameters
|
||||
this._outerId = _outerId;
|
||||
this._columnIds = _columnIds;
|
||||
this._dataProvider = _dataProvider;
|
||||
this._avgHeight = _avgHeight;
|
||||
|
||||
// Create the row provider
|
||||
this._rowProvider = new et2_dataview_rowProvider(_outerId,
|
||||
_columnIds);
|
||||
|
||||
this._scrollHeight = 0;
|
||||
this._scrollTimeout = null;
|
||||
}
|
||||
|
||||
// The "treeChanged" variable is called whenever the viewrange has been
|
||||
// set - changing the viewrange is the function which causes new elements
|
||||
// to be generated and thus the partition tree to degenerate
|
||||
this._treeChanged = false;
|
||||
|
||||
// Count of elements which are buffered at top and bottom of the viewrange
|
||||
// before they get replaced with placeholders
|
||||
this._holdCount = 50;
|
||||
|
||||
// The current range holds the currently visible nodes
|
||||
this._currentRange = et2_range(0, 0);
|
||||
|
||||
// Build the grid outer nodes
|
||||
this._createNodes();
|
||||
|
||||
init: function(_dataProvider, _count, _avgHeight) {
|
||||
// Create the partition tree object which is used to organize the tree
|
||||
// items.
|
||||
this._partitionTree = new et2_dataview_partitionTree(_dataProvider,
|
||||
_count, _avgHeight);
|
||||
this._partitionTree = new et2_dataview_partitionTree(this._dataProvider,
|
||||
this._rowProvider, this._avgHeight, this.innerTbody);
|
||||
|
||||
// Setup the "rebuild" timer - it rebuilds the complete partition tree
|
||||
// if any change has been done to it. Rebuilding the partition tree is
|
||||
// necessary as the tree structure happens to degenerate.
|
||||
var self = this;
|
||||
this._rebuildTimer = window.setInterval(function() {
|
||||
self._checkTreeRebuild();
|
||||
}, 10 * 1000);
|
||||
},
|
||||
|
||||
destroy: function() {
|
||||
// Free the partition tree
|
||||
// Stop the scroll timeout
|
||||
if (this._scrollTimeout)
|
||||
{
|
||||
window.clearTimeout(this._scrollTimeout);
|
||||
}
|
||||
|
||||
// Stop the rebuild timer
|
||||
window.clearInterval(this._rebuildTimer);
|
||||
|
||||
// Free the partition tree and the row provider
|
||||
this._partitionTree.free();
|
||||
this._rowProvider.free();
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* The setViewRange function updates the range in which columns are shown.
|
||||
*/
|
||||
setViewRange: function(_range) {
|
||||
this._treeChanged = true;
|
||||
|
||||
// Copy the given range
|
||||
this._currentRange = et2_bounds(_range.top, _range.bottom);
|
||||
|
||||
// Display all elements in the given range
|
||||
var nodes = this._partitionTree.getRangeNodes(_range);
|
||||
|
||||
for (var i = 0; i < nodes.length; i++)
|
||||
{
|
||||
if (nodes[i].implements(et2_dataview_IViewRange))
|
||||
{
|
||||
nodes[i].setViewRange(_range);
|
||||
}
|
||||
}
|
||||
|
||||
// Deactivated the code below for testing purposes
|
||||
|
||||
// Calculate the range of the actually shown elements
|
||||
/*var displayTop = _range.top;
|
||||
var displayBottom = _range.bottom;
|
||||
|
||||
if (nodes.length > 0)
|
||||
{
|
||||
displayTop = nodes[0].getPosTop();
|
||||
displayBottom = nodes[nodes.length - 1].getPosBottom();
|
||||
}
|
||||
|
||||
// Hide everything except for _holdCount elements at the top and bottom
|
||||
// of the viewrange
|
||||
var reduceHeight = this._partitionTree.getAverageHeight() * this._holdCount;
|
||||
|
||||
if (displayTop > reduceHeight)
|
||||
{
|
||||
this._partitionTree.reduce(et2_bounds(0, displayTop - reduceHeight));
|
||||
}
|
||||
|
||||
if (displayBottom + reduceHeight < this._partitionTree.getHeight())
|
||||
{
|
||||
this._partitionTree.reduce(et2_bounds(displayBottom + reduceHeight,
|
||||
this._partitionTree.getHeight()));
|
||||
}*/
|
||||
},
|
||||
|
||||
/**
|
||||
* Updates the scrollheight
|
||||
*/
|
||||
setScrollHeight: function(_height) {
|
||||
this._height = _height;
|
||||
|
||||
// Update the height of the outer container
|
||||
if (this.scrollarea)
|
||||
{
|
||||
this.scrollarea.height(_height);
|
||||
}
|
||||
|
||||
// Update the viewing range
|
||||
this.setViewRange(et2_range(this._currentRange.top, this._height));
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns the JQuery outer DOM-Node
|
||||
*/
|
||||
getJNode: function() {
|
||||
return this.outerCell;
|
||||
},
|
||||
|
||||
/* ---- PRIVATE FUNCTIONS ---- */
|
||||
|
||||
/**
|
||||
* Checks whether the partition tree has to be rebuilt and if yes, does
|
||||
* that.
|
||||
*/
|
||||
_checkTreeRebuild: function() {
|
||||
if (this._treeChanged)
|
||||
{
|
||||
var depth = this._partitionTree.getDepth();
|
||||
var count = this._partitionTree.getManagedCount();
|
||||
|
||||
// Check whether the depth of the tree is very unproportional
|
||||
// regarding to the count of elements managed in it
|
||||
if (count < Math.pow(ET2_PARTITION_TREE_WIDTH, depth - 1))
|
||||
{
|
||||
this._partitionTree.rebuild();
|
||||
}
|
||||
|
||||
// Reset the "treeChanged" function.
|
||||
this._treeChanged = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Creates the grid DOM-Nodes
|
||||
*/
|
||||
_createNodes: function() {
|
||||
this.outerCell = $j(document.createElement("td"))
|
||||
.addClass("frame")
|
||||
.attr("colspan", this._columnIds.length + (this._parent ? 0 : 1));
|
||||
|
||||
// Create the scrollarea div if this is the outer grid
|
||||
this.scrollarea = null;
|
||||
if (this._parent == null)
|
||||
{
|
||||
this.scrollarea = $j(document.createElement("div"))
|
||||
.addClass("egwGridView_scrollarea")
|
||||
.scroll(this, function(e) {
|
||||
|
||||
// Clear any older scroll timeout
|
||||
if (e.data._scrollTimeout)
|
||||
{
|
||||
window.clearTimeout(e.data._scrollTimeout);
|
||||
}
|
||||
|
||||
// Set a new timeout which calls the setViewArea
|
||||
// function
|
||||
e.data._scrollTimeout = window.setTimeout(function() {
|
||||
e.data.setViewRange(et2_range(
|
||||
e.data.scrollarea.scrollTop(),
|
||||
e.data._height
|
||||
));
|
||||
}, 25);
|
||||
})
|
||||
.height(this._scrollHeight)
|
||||
.appendTo(this.outerCell);
|
||||
}
|
||||
|
||||
// Create the inner table
|
||||
var table = $j(document.createElement("table"))
|
||||
.addClass("egwGridView_grid")
|
||||
.appendTo(this.scrollarea ? this.scrollarea : this.outerCell);
|
||||
|
||||
this.innerTbody = $j(document.createElement("tbody"))
|
||||
.appendTo(table);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
Reference in New Issue
Block a user