/**
|
|
* @constructor Group
|
|
* @param {Panel} contentPanel
|
|
* @param {Panel} labelPanel
|
|
* @param {Number | String} groupId
|
|
* @param {Object} [options] Options to set initial property values
|
|
* // TODO: describe available options
|
|
* @extends Component
|
|
*/
|
|
function Group (contentPanel, labelPanel, groupId, options) {
|
|
this.id = util.randomUUID();
|
|
this.contentPanel = contentPanel;
|
|
this.labelPanel = labelPanel;
|
|
|
|
this.groupId = groupId;
|
|
this.itemSet = null; // ItemSet
|
|
this.options = options || {};
|
|
this.options.top = 0;
|
|
|
|
this.props = {
|
|
label: {
|
|
width: 0,
|
|
height: 0
|
|
}
|
|
};
|
|
|
|
this.top = 0;
|
|
this.left = 0;
|
|
this.width = 0;
|
|
this.height = 0;
|
|
}
|
|
|
|
Group.prototype = new Component();
|
|
|
|
// TODO: comment
|
|
Group.prototype.setOptions = Component.prototype.setOptions;
|
|
|
|
/**
|
|
* Get the container element of the panel, which can be used by a child to
|
|
* add its own widgets.
|
|
* @returns {HTMLElement} container
|
|
*/
|
|
Group.prototype.getContainer = function () {
|
|
return null;
|
|
};
|
|
|
|
/**
|
|
* Set item set for the group. The group will create a view on the itemSet,
|
|
* filtered by the groups id.
|
|
* @param {DataSet | DataView} items
|
|
*/
|
|
Group.prototype.setItems = function setItems(items) {
|
|
if (this.itemSet) {
|
|
// remove current item set
|
|
this.itemSet.hide();
|
|
this.itemSet.setItems();
|
|
this.contentPanel.removeChild(this.itemSet);
|
|
this.itemSet = null;
|
|
}
|
|
|
|
if (items) {
|
|
var groupId = this.groupId;
|
|
|
|
var itemSetOptions = Object.create(this.options);
|
|
this.itemSet = new ItemSet(itemSetOptions);
|
|
if (this.range) this.itemSet.setRange(this.range);
|
|
this.contentPanel.appendChild(this.itemSet);
|
|
|
|
this.view = new DataView(items, {
|
|
filter: function (item) {
|
|
return item.group == groupId;
|
|
}
|
|
});
|
|
this.itemSet.setItems(this.view);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Set range (start and end).
|
|
* @param {Range | Object} range A Range or an object containing start and end.
|
|
*/
|
|
Group.prototype.setRange = function (range) {
|
|
this.range = range;
|
|
|
|
if (this.itemSet) this.itemSet.setRange(range);
|
|
};
|
|
|
|
/**
|
|
* Set selected items by their id. Replaces the current selection.
|
|
* Unknown id's are silently ignored.
|
|
* @param {Array} [ids] An array with zero or more id's of the items to be
|
|
* selected. If ids is an empty array, all items will be
|
|
* unselected.
|
|
*/
|
|
Group.prototype.setSelection = function setSelection(ids) {
|
|
if (this.itemSet) this.itemSet.setSelection(ids);
|
|
};
|
|
|
|
/**
|
|
* Get the selected items by their id
|
|
* @return {Array} ids The ids of the selected items
|
|
*/
|
|
Group.prototype.getSelection = function getSelection() {
|
|
return this.itemSet ? this.itemSet.getSelection() : [];
|
|
};
|
|
|
|
/**
|
|
* Repaint the group
|
|
* @return {Boolean} changed
|
|
*/
|
|
Group.prototype.repaint = function repaint() {
|
|
this.itemSet.repaint();
|
|
|
|
this.top = this.itemSet ? this.itemSet.top : 0;
|
|
this.height = this.itemSet ? this.itemSet.height : 0;
|
|
|
|
// TODO: reckon with the height of the group label
|
|
|
|
if (this.label) {
|
|
// TODO: only update the labels width/height when the label is changed
|
|
var inner = this.label.firstChild;
|
|
this.props.label.width = inner.clientWidth;
|
|
this.props.label.height = inner.clientHeight;
|
|
}
|
|
else {
|
|
this.props.label.width = 0;
|
|
this.props.label.height = 0;
|
|
}
|
|
};
|