From 08b6ba904e0192b054402b900eef75510d85fce7 Mon Sep 17 00:00:00 2001 From: josdejong Date: Thu, 2 May 2013 14:43:10 +0200 Subject: [PATCH] Added an option to force a reflow/repaint instead of kindly request it --- examples/timeline/01_basic.html | 28 +++++----- examples/timeline/02_dataset.html | 60 ++++++++++----------- examples/timeline/04_a_lot_of_data.html | 70 +++++++++++++++++++++++++ src/controller.js | 43 ++++++++++----- src/visualization/timeline.js | 7 +-- test/timeline.html | 2 +- vis.js | 52 +++++++++++------- vis.min.js | 6 +-- 8 files changed, 185 insertions(+), 83 deletions(-) create mode 100644 examples/timeline/04_a_lot_of_data.html diff --git a/examples/timeline/01_basic.html b/examples/timeline/01_basic.html index b09cf82f..7d73e901 100644 --- a/examples/timeline/01_basic.html +++ b/examples/timeline/01_basic.html @@ -12,20 +12,20 @@ -
+
- + \ No newline at end of file diff --git a/examples/timeline/02_dataset.html b/examples/timeline/02_dataset.html index e72dfa5a..5c3c99cc 100644 --- a/examples/timeline/02_dataset.html +++ b/examples/timeline/02_dataset.html @@ -6,7 +6,7 @@ + + + + +

+ Test with a lot of data +

+

+ + + +

+
+ + + + \ No newline at end of file diff --git a/src/controller.js b/src/controller.js index 6c15b3c2..7da6a572 100644 --- a/src/controller.js +++ b/src/controller.js @@ -32,28 +32,43 @@ Controller.prototype.add = function (component) { /** * Request a reflow. The controller will schedule a reflow + * @param {Boolean} [force] If true, an immediate reflow is forced. Default + * is false. */ -Controller.prototype.requestReflow = function () { - if (!this.reflowTimer) { - var me = this; - this.reflowTimer = setTimeout(function () { - me.reflowTimer = undefined; - me.reflow(); - }, 0); +Controller.prototype.requestReflow = function (force) { + if (force) { + this.reflow(); + } + else { + if (!this.reflowTimer) { + var me = this; + this.reflowTimer = setTimeout(function () { + me.reflowTimer = undefined; + me.reflow(); + }, 0); + } } }; /** * Request a repaint. The controller will schedule a repaint + * @param {Boolean} [force] If true, an immediate repaint is forced. Default + * is false. */ -Controller.prototype.requestRepaint = function () { - if (!this.repaintTimer) { - var me = this; - this.repaintTimer = setTimeout(function () { - me.repaintTimer = undefined; - me.repaint(); - }, 0); +Controller.prototype.requestRepaint = function (force) { + if (force) { + this.repaint(); } + else { + if (!this.repaintTimer) { + var me = this; + this.repaintTimer = setTimeout(function () { + me.repaintTimer = undefined; + me.repaint(); + }, 0); + } + } + }; /** diff --git a/src/visualization/timeline.js b/src/visualization/timeline.js index c92ddcd9..7821454a 100644 --- a/src/visualization/timeline.js +++ b/src/visualization/timeline.js @@ -40,11 +40,12 @@ function Timeline (container, data, options) { this.range.subscribe(this.main, 'move', 'horizontal'); this.range.subscribe(this.main, 'zoom', 'horizontal'); this.range.on('rangechange', function () { - // TODO: fix the delay in reflow/repaint, does not feel snappy - me.controller.requestReflow(); + var force = true; + me.controller.requestReflow(force); }); this.range.on('rangechanged', function () { - me.controller.requestReflow(); + var force = true; + me.controller.requestReflow(force); }); // TODO: put the listeners in setOptions, be able to dynamically change with options moveable and zoomable diff --git a/test/timeline.html b/test/timeline.html index 0f8d549c..14c7a02e 100644 --- a/test/timeline.html +++ b/test/timeline.html @@ -7,7 +7,7 @@