From 58e81f3f7017b819fb1c303b2769cdc2aa30fe3b Mon Sep 17 00:00:00 2001 From: jos Date: Wed, 30 Apr 2014 11:24:20 +0200 Subject: [PATCH] Created a Group holding ungrouped items, for timelines not using groups --- src/timeline/Stack.js | 5 +- src/timeline/component/Component.js | 2 +- src/timeline/component/ItemSet.js | 81 ++++++++++++++++++------ src/timeline/component/item/Item.js | 2 +- src/timeline/component/item/ItemRange.js | 4 +- 5 files changed, 68 insertions(+), 26 deletions(-) diff --git a/src/timeline/Stack.js b/src/timeline/Stack.js index 57a2ef66..0e249c12 100644 --- a/src/timeline/Stack.js +++ b/src/timeline/Stack.js @@ -92,7 +92,6 @@ Stack.prototype.orderByEnd = function orderByEnd(items) { * @param {boolean} [force=false] If true, all items will be re-stacked. * If false (default), only items having a * top===null will be re-stacked - * @private */ Stack.prototype.stack = function stack (items, force) { var i, @@ -152,8 +151,8 @@ Stack.prototype.stack = function stack (items, force) { /** * Test if the two provided items collide * The items must have parameters left, width, top, and height. - * @param {Component} a The first item - * @param {Component} b The second item + * @param {Item} a The first item + * @param {Item} b The second item * @param {Number} margin A minimum required margin. * If margin is provided, the two items will be * marked colliding when they overlap or diff --git a/src/timeline/component/Component.js b/src/timeline/component/Component.js index 437e8015..76ac811c 100644 --- a/src/timeline/component/Component.js +++ b/src/timeline/component/Component.js @@ -74,7 +74,7 @@ Component.prototype.repaint = function repaint() { * Test whether the component is resized since the last time _isResized() was * called. * @return {Boolean} Returns true if the component is resized - * @private + * @protected */ Component.prototype._isResized = function _isResized() { var resized = (this._previousWidth !== this.width || this._previousHeight !== this.height); diff --git a/src/timeline/component/ItemSet.js b/src/timeline/component/ItemSet.js index baa136d2..97dab172 100644 --- a/src/timeline/component/ItemSet.js +++ b/src/timeline/component/ItemSet.js @@ -67,6 +67,7 @@ function ItemSet(backgroundPanel, axisPanel, labelPanel, options) { this.groups = {}; // Group object for every group this.groupIds = []; + this.ungrouped = null; // Group holding all ungrouped items (yeah, funny right?), used when there are no groups this.visibleItems = []; // visible, ordered items this.selection = []; // list with the ids of all selected nodes @@ -383,7 +384,6 @@ ItemSet.prototype.repaint = function repaint() { options = this.options, orientation = this.getOption('orientation'), frame = this.frame, - initialPosByStart, i, ii; // update className @@ -507,6 +507,36 @@ ItemSet.prototype._updateVisibleItems = function _updateVisibleItems(orderedItem return newVisibleItems; }; +/** + * Create or delete the group holding all ungrouped items. This group is used when + * there are no groups specified. + * @protected + */ +ItemSet.prototype._updateUngrouped = function _updateUngrouped() { + if (this.groupsData) { + // remove the group holding all (unfiltered) items + if (this.ungrouped) { + this.ungrouped.hide(); + this.ungrouped = null; + } + } + else { + // create a group holding all (unfiltered) items + if (!this.ungrouped) { + var id = null; + this.ungrouped = new Group(id, this, this.dom.background, this.dom.axis, this.labelPanel.frame); + + for (var itemId in this.items) { + if (this.items.hasOwnProperty(itemId)) { + this.ungrouped.add(this.items[itemId]); + } + } + + this.ungrouped.show(); + } + } +}; + /** * Get the foreground container element * @return {HTMLElement} foreground @@ -577,9 +607,12 @@ ItemSet.prototype.setItems = function setItems(items) { me.itemsData.on(event, callback, id); }); - // draw all new items + // add all new items ids = this.itemsData.getIds(); this._onAdd(ids); + + // update the group holding all ungrouped items + this._updateUngrouped(); } }; @@ -633,6 +666,9 @@ ItemSet.prototype.setGroups = function setGroups(groups) { this._onAddGroups(ids); } + // update the group holding all ungrouped items + this._updateUngrouped(); + this.emit('change'); }; @@ -667,7 +703,7 @@ ItemSet.prototype.removeItem = function removeItem (id) { /** * Handle updated items * @param {Number[]} ids - * @private + * @protected */ ItemSet.prototype._onUpdate = function _onUpdate(ids) { var me = this, @@ -721,14 +757,14 @@ ItemSet.prototype._onUpdate = function _onUpdate(ids) { /** * Handle added items * @param {Number[]} ids - * @private + * @protected */ ItemSet.prototype._onAdd = ItemSet.prototype._onUpdate; /** * Handle removed items * @param {Number[]} ids - * @private + * @protected */ ItemSet.prototype._onRemove = function _onRemove(ids) { var count = 0; @@ -822,15 +858,6 @@ ItemSet.prototype._updateGroupIds = function () { this.groupIds = this.groupsData.getIds({ order: this.options.groupOrder }); - - /* TODO - // hide the groups now, they will be shown again in the next repaint - // in correct order - var groups = this.groups; - this.groupIds.forEach(function (id) { - groups[id].hide(); - }); - */ }; /** @@ -841,8 +868,11 @@ ItemSet.prototype._updateGroupIds = function () { ItemSet.prototype._addItem = function _addItem(item) { this.items[item.id] = item; - // add to group (if any) - if ('group' in item.data) { + // add to group + if (this.ungrouped) { + this.ungrouped.add(item); + } + else { var group = this.groups[item.data.group]; if (group) group.add(item); } @@ -868,7 +898,10 @@ ItemSet.prototype._updateItem = function _updateItem(item, itemData) { if (group) group.remove(item); } - if ('group' in item.data) { + if (this.ungrouped) { + this.ungrouped.add(item); + } + else { group = this.groups[item.data.group]; if (group) group.add(item); } @@ -896,8 +929,11 @@ ItemSet.prototype._removeItem = function _removeItem(item) { index = this.selection.indexOf(item.id); if (index != -1) this.selection.splice(index, 1); - // remove from group (if any) - if ('group' in item.data) { + // remove from group + if (this.ungrouped) { + this.ungrouped.remove(item); + } + else { var group = this.groups[item.data.group]; if (group) group.remove(item); } @@ -919,8 +955,15 @@ ItemSet.prototype._order = function _order() { this.stack.orderByEnd(this.orderedItems.byEnd); }; +/** + * Create an array containing all items being a range (having an end date) + * @param array + * @returns {Array} + * @private + */ ItemSet.prototype._constructByEndArray = function _constructByEndArray(array) { var endArray = []; + for (var i = 0; i < array.length; i++) { if (array[i] instanceof ItemRange) { endArray.push(array[i]); diff --git a/src/timeline/component/item/Item.js b/src/timeline/component/item/Item.js index 064d8c6a..6f6cef77 100644 --- a/src/timeline/component/item/Item.js +++ b/src/timeline/component/item/Item.js @@ -108,7 +108,7 @@ Item.prototype.repositionY = function repositionY() { /** * Repaint a delete button on the top right of the item when the item is selected * @param {HTMLElement} anchor - * @private + * @protected */ Item.prototype._repaintDeleteButton = function (anchor) { if (this.selected && this.options.editable && !this.dom.deleteButton) { diff --git a/src/timeline/component/item/ItemRange.js b/src/timeline/component/item/ItemRange.js index 122e1304..706555cc 100644 --- a/src/timeline/component/item/ItemRange.js +++ b/src/timeline/component/item/ItemRange.js @@ -205,7 +205,7 @@ ItemRange.prototype.repositionY = function repositionY() { /** * Repaint a drag area on the left side of the range when the range is selected - * @private + * @protected */ ItemRange.prototype._repaintDragLeft = function () { if (this.selected && this.options.editable && !this.dom.dragLeft) { @@ -235,7 +235,7 @@ ItemRange.prototype._repaintDragLeft = function () { /** * Repaint a drag area on the right side of the range when the range is selected - * @private + * @protected */ ItemRange.prototype._repaintDragRight = function () { if (this.selected && this.options.editable && !this.dom.dragRight) {