From 8c5fe02e4117cf61e2632eeb7523a4dd5027e0ac Mon Sep 17 00:00:00 2001 From: jos Date: Tue, 22 Apr 2014 14:26:24 +0200 Subject: [PATCH] Added an example showing custom ordering of groups --- examples/timeline/05_groups.html | 2 +- examples/timeline/09_order_groups.html | 67 ++++++++++++++++++++++++++ examples/timeline/index.html | 1 + src/timeline/component/Group.js | 7 ++- test/timeline.html | 12 ++--- test/timeline_groups.html | 24 +++------ 6 files changed, 81 insertions(+), 32 deletions(-) create mode 100644 examples/timeline/09_order_groups.html diff --git a/examples/timeline/05_groups.html b/examples/timeline/05_groups.html index a103d1a3..982cb7fd 100644 --- a/examples/timeline/05_groups.html +++ b/examples/timeline/05_groups.html @@ -60,7 +60,7 @@ // create visualization var container = document.getElementById('visualization'); var options = { - groupOrder: 'content' + groupOrder: 'content' // groupOrder can be a property name or a sorting function }; var timeline = new vis.Timeline(container); diff --git a/examples/timeline/09_order_groups.html b/examples/timeline/09_order_groups.html new file mode 100644 index 00000000..d7556491 --- /dev/null +++ b/examples/timeline/09_order_groups.html @@ -0,0 +1,67 @@ + + + + Timeline | Order groups + + + + + + + +

+ This example demonstrate custom ordering of groups. +

+
+ + + + \ No newline at end of file diff --git a/examples/timeline/index.html b/examples/timeline/index.html index 4017ec88..5c933428 100644 --- a/examples/timeline/index.html +++ b/examples/timeline/index.html @@ -20,6 +20,7 @@

06_event_listeners.html

07_custom_time_bar.html

08_edit_items.html

+

09_order_groups.html

diff --git a/src/timeline/component/Group.js b/src/timeline/component/Group.js index 2c4043c5..282bc97d 100644 --- a/src/timeline/component/Group.js +++ b/src/timeline/component/Group.js @@ -91,6 +91,7 @@ Group.prototype.setItems = function setItems(itemsData) { if (this.itemSet) { // remove current item set this.itemSet.setItems(); + this.itemSet.hide(); this.groupPanel.frame.removeChild(this.itemSet.getFrame()); this.itemSet = null; } @@ -129,16 +130,14 @@ Group.prototype.show = function show() { this.labelPanel.frame.appendChild(this.dom.label); } - if (this.itemSet) { - this.itemSet.show(); - } - var itemSetFrame = this.itemSet && this.itemSet.getFrame(); if (itemSetFrame) { if (itemSetFrame.parentNode) { itemSetFrame.parentNode.removeChild(itemSetFrame); } this.groupPanel.frame.appendChild(itemSetFrame); + + this.itemSet.show(); } }; diff --git a/test/timeline.html b/test/timeline.html index 2c842cdf..44c020ce 100644 --- a/test/timeline.html +++ b/test/timeline.html @@ -113,15 +113,9 @@ }); */ - items.on('add', function (nodes) { - console.log('add', nodes); - }); - items.on('update', function (nodes) { - console.log('update', nodes); - }); - items.on('remove', function (nodes) { - console.log('remove', nodes); - }); + items.on('add', console.log.bind(console)); + items.on('update', console.log.bind(console)); + items.on('remove', console.log.bind(console)); diff --git a/test/timeline_groups.html b/test/timeline_groups.html index d2c3c49c..d6ad61b5 100644 --- a/test/timeline_groups.html +++ b/test/timeline_groups.html @@ -107,25 +107,13 @@ }); */ - items.on('add', function (nodes) { - console.log('items add', nodes); - }); - items.on('update', function (nodes) { - console.log('items update', nodes); - }); - items.on('remove', function (nodes) { - console.log('items remove', nodes); - }); + items.on('add', console.log.bind(console)); + items.on('update', console.log.bind(console)); + items.on('remove', console.log.bind(console)); - groups.on('add', function (nodes) { - console.log('groups add', nodes); - }); - groups.on('update', function (nodes) { - console.log('groups update', nodes); - }); - groups.on('remove', function (nodes) { - console.log('groups remove', nodes); - }); + groups.on('add', console.log.bind(console)); + groups.on('update', console.log.bind(console)); + groups.on('remove', console.log.bind(console));