From a12e44dc143a32cc4e3d3662e80943cc48a0a68e Mon Sep 17 00:00:00 2001 From: Alex de Mulder Date: Tue, 14 Oct 2014 19:09:06 +0200 Subject: [PATCH] updated subgroups to have specific indexes for sorting later on --- examples/timeline/30_subgroups.html | 12 ++++----- lib/timeline/Stack.js | 8 +++--- lib/timeline/component/Group.js | 4 ++- lib/timeline/component/item/BackgroundItem.js | 27 ++++++++++--------- 4 files changed, 27 insertions(+), 24 deletions(-) diff --git a/examples/timeline/30_subgroups.html b/examples/timeline/30_subgroups.html index c370de13..86511fb3 100644 --- a/examples/timeline/30_subgroups.html +++ b/examples/timeline/30_subgroups.html @@ -48,13 +48,13 @@ {id: 'B', content:'1',start: '2014-01-22', end: '2014-01-23', type: 'background', group:'foo', className: 'negative'}, {id: 0, content: 'item 4', start: '2014-01-20', end: '2014-01-22',group:'foo'}, - {id: 'ab', content:'1',start: '2014-01-25', end: '2014-01-27', type: 'background', group:'bar', subgroup:0}, - {id: 'bb', content:'1',start: '2014-01-26', end: '2014-01-27', type: 'background', className: 'positive',group:'bar', subgroup:0}, - {id: 1, content: '0', start: '2014-01-25 12:00:00', end: '2014-01-26 12:00:00',group:'bar', subgroup:0}, - {id: 'aab', content:'1',start: '2014-01-27', end: '2014-01-29', type: 'background', group:'bar', subgroup:1}, - {id: 'bab', content:'1',start: '2014-01-27', end: '2014-01-28', type: 'background', className: 'negative',group:'bar', subgroup:1}, + {id: 'ab', content:'1',start: '2014-01-25', end: '2014-01-27', type: 'background', group:'bar', subgroup:'banana'}, + {id: 'bb', content:'1',start: '2014-01-26', end: '2014-01-27', type: 'background', className: 'positive',group:'bar', subgroup:'banana'}, + {id: 1, content: '0', start: '2014-01-25 12:00:00', end: '2014-01-26 12:00:00',group:'bar', subgroup:'banana'}, + {id: 'aab', content:'1',start: '2014-01-27', end: '2014-01-29', type: 'background', group:'bar', subgroup:'putty'}, + {id: 'bab', content:'1',start: '2014-01-27', end: '2014-01-28', type: 'background', className: 'negative',group:'bar', subgroup:'putty'}, {id: 'bdab', content:'1',start: '2014-01-29', end: '2014-01-30', type: 'background', className: 'negative',group:'bar'}, - {id: 2, content: 'subgroup1', start: '2014-01-27', end: '2014-01-29',group:'bar', subgroup:1}, + {id: 2, content: 'subgroup1', start: '2014-01-27', end: '2014-01-29',group:'bar', subgroup:'putty'}, ]); var container = document.getElementById('visualization'); diff --git a/lib/timeline/Stack.js b/lib/timeline/Stack.js index 35850c22..0e3fb867 100644 --- a/lib/timeline/Stack.js +++ b/lib/timeline/Stack.js @@ -89,10 +89,10 @@ exports.nostack = function(items, margin, subgroups) { for (i = 0, iMax = items.length; i < iMax; i++) { if (items[i].data.subgroup !== undefined) { newTop = margin.axis; - for (var subgroupIdx in subgroups) { - if (subgroups.hasOwnProperty(subgroupIdx)) { - if (subgroups[subgroupIdx].visible == true && subgroupIdx < items[i].data.subgroup) { - newTop += subgroups[subgroupIdx].height + margin.item.vertical; + for (var subgroup in subgroups) { + if (subgroups.hasOwnProperty(subgroup)) { + if (subgroups[subgroup].visible == true && subgroups[subgroup].index < subgroups[items[i].data.subgroup].index) { + newTop += subgroups[subgroup].height + margin.item.vertical; } } } diff --git a/lib/timeline/component/Group.js b/lib/timeline/component/Group.js index 0ce7d484..386646ec 100644 --- a/lib/timeline/component/Group.js +++ b/lib/timeline/component/Group.js @@ -284,9 +284,11 @@ Group.prototype.add = function(item) { item.setParent(this); // add to + var index = 0; if (item.data.subgroup !== undefined) { if (this.subgroups[item.data.subgroup] === undefined) { - this.subgroups[item.data.subgroup] = {height:0, visible: false}; + this.subgroups[item.data.subgroup] = {height:0, visible: false, index:index}; + index++; } } diff --git a/lib/timeline/component/item/BackgroundItem.js b/lib/timeline/component/item/BackgroundItem.js index aaef2fd7..c2f32552 100644 --- a/lib/timeline/component/item/BackgroundItem.js +++ b/lib/timeline/component/item/BackgroundItem.js @@ -145,38 +145,39 @@ BackgroundItem.prototype.repositionY = function(margin) { // special positioning for subgroups if (this.data.subgroup !== undefined) { - var subgroup = this.data.subgroup; + var itemSubgroup = this.data.subgroup; var subgroups = this.parent.subgroups; + var subgroupIndex = subgroups[itemSubgroup].index; // if the orientation is top, we need to take the difference in height into account. if (onTop == true) { // the first subgroup will have to account for the distance from the top to the first item. - height = this.parent.subgroups[subgroup].height + margin.item.vertical; - height += subgroup == 0 ? margin.axis - 0.5*margin.item.vertical : 0; + height = this.parent.subgroups[itemSubgroup].height + margin.item.vertical; + height += subgroupIndex == 0 ? margin.axis - 0.5*margin.item.vertical : 0; var newTop = this.parent.top; - for (var subgroupIdx in subgroups) { - if (subgroups.hasOwnProperty(subgroupIdx)) { - if (subgroups[subgroupIdx].visible == true && subgroupIdx < subgroup) { - newTop += subgroups[subgroupIdx].height + margin.item.vertical; + for (var subgroup in subgroups) { + if (subgroups.hasOwnProperty(subgroup)) { + if (subgroups[subgroup].visible == true && subgroups[subgroup].index < subgroupIndex) { + newTop += subgroups[subgroup].height + margin.item.vertical; } } } // the others will have to be offset downwards with this same distance. - newTop += subgroup != 0 ? margin.axis - 0.5 * margin.item.vertical : 0; + newTop += subgroupIndex != 0 ? margin.axis - 0.5 * margin.item.vertical : 0; this.dom.box.style.top = newTop + 'px'; this.dom.box.style.bottom = ''; } // and when the orientation is bottom: else { var newTop = this.parent.top; - for (var subgroupIdx in subgroups) { - if (subgroups.hasOwnProperty(subgroupIdx)) { - if (subgroups[subgroupIdx].visible == true && subgroupIdx > subgroup) { - newTop += subgroups[subgroupIdx].height + margin.item.vertical; + for (var subgroup in subgroups) { + if (subgroups.hasOwnProperty(subgroup)) { + if (subgroups[subgroup].visible == true && subgroups[subgroup].index > subgroupIndex) { + newTop += subgroups[subgroup].height + margin.item.vertical; } } } - height = this.parent.subgroups[subgroup].height + margin.item.vertical; + height = this.parent.subgroups[itemSubgroup].height + margin.item.vertical; this.dom.box.style.top = newTop + 'px'; this.dom.box.style.bottom = ''; }