Added dynamic throttling of events to live/dynamic widgets

holoviews/plotting/bokeh/bokehwidgets.js

@@ -50,15 +50,27 @@ var BokehMethods = {
 		}
 		function callback(initialized, msg){
 			/* This callback receives data from Python as a string
-			 in order to parse it correctly quotes are sliced off*/
+			   in order to parse it correctly quotes are sliced off*/
 			if (msg.content.ename != undefined) {
 				this.process_error(msg);
 			}
 			if (msg.msg_type != "execute_result") {
 				console.log("Warning: HoloViews callback returned unexpected data for key: (", current, ") with the following content:", msg.content)
+				this.time = undefined;
+				this.wait = false;
 				return
 			}
+			this.timed = (Date.now() - this.time) * 1.1;
 			if (msg.msg_type == "execute_result") {
+				if (msg.content.data['text/plain'] === "'Complete'") {
+					this.wait = false;
+					if (this.queue.length > 0) {
+						this.time = Date.now();
+						this.dynamic_update(this.queue[this.queue.length-1]);
+						this.queue = [];
+					}
+					return
+			    }
 				var data = msg.content.data['text/plain'].slice(1, -1);
 				this.frames[current] = JSON.parse(data);
 				this.update(current);

holoviews/plotting/bokeh/widgets.py

@@ -66,6 +66,7 @@ def _plot_figure(self, idx, fig_format='json'):
             else:
                 handle._json = to_json
             handle.comms.send(json.dumps(msg))
+            return 'Complete'
 
 
 class BokehSelectionWidget(BokehWidget, SelectionWidget):

holoviews/plotting/mpl/mplwidgets.js

@@ -47,6 +47,7 @@ var MPLMethods = {
 			}
 			if (msg.msg_type != "execute_result") {
 				console.log("Warning: HoloViews callback returned unexpected data for key: (", current, ") with the following content:", msg.content)
+				this.time = undefined;
 				return
 			}
 			if (!(this.mode == 'nbagg')) {
@@ -60,6 +61,14 @@ var MPLMethods = {
 				}
 				this.update(current);
 			}
+			this.timed = (Date.now() - this.time) * 1.5;
+			this.wait = false;
+			if (this.queue.length > 0) {
+				var current_vals = this.queue[this.queue.length-1];
+				this.time = Date.now();
+				this.dynamic_update(current_vals);
+				this.queue = [];
+			}
 		}
 		var kernel = IPython.notebook.kernel;
 		callbacks = {iopub: {output: $.proxy(callback, this)}};

holoviews/plotting/widgets/jsslider.jinja

@@ -104,7 +104,7 @@
                 dim_vals: vals,
                 dim_labels: labels,
                 next_vals: next_vals,
-                slide: _.throttle(function(event, ui) {
+                slide: function(event, ui) {
                     var vals = slider.slider("option", "dim_vals");
                     var next_vals = slider.slider("option", "next_vals");
                     var labels = slider.slider("option", "dim_labels");
@@ -124,7 +124,7 @@
                         var next_widget = $('#_anim_widget{{ id }}_{{ widget_data['next_dim'] }}');
                         update_widget(next_widget, new_vals);
                     }
-                }, {{ throttle }})
+                }
             });
             slider.keypress(function(event) {
                 if (event.which == 80 || event.which == 112) {

holoviews/plotting/widgets/widgets.js

@@ -71,6 +71,7 @@ HoloViewsWidget.prototype.update = function(current){
             value.hide();
         });
         this.cache[current].show();
+		this.wait = false;
     }
 }
 
@@ -92,17 +93,15 @@ function SelectionWidget(frames, id, slider_ids, keyMap, dim_vals, notFound, loa
     this.cache = {};
 	this.json_path = json_path;
     this.init_slider(this.current_vals[0]);
+	this.queue = [];
+	this.wait = false;
 }
 
 SelectionWidget.prototype = new HoloViewsWidget;
 
-SelectionWidget.prototype.set_frame = function(dim_val, dim_idx){
-    this.current_vals[dim_idx] = dim_val;
-    if(this.dynamic) {
-        this.dynamic_update(this.current_vals)
-        return;
-    }
-    var key = "(";
+
+SelectionWidget.prototype.get_key = function(current_vals) {
+	var key = "(";
     for (var i=0; i<this.slider_ids.length; i++)
     {
         val = this.current_vals[i];
@@ -116,7 +115,30 @@ SelectionWidget.prototype.set_frame = function(dim_val, dim_idx){
         else if(this.slider_ids.length == 1) { key += ',';}
     }
     key += ")";
-    var current = this.keyMap[key];
+	return this.keyMap[key];
+}
+
+SelectionWidget.prototype.set_frame = function(dim_val, dim_idx){
+	this.current_vals[dim_idx] = dim_val;
+	if (this.dynamic || !this.cached) {
+		if (this.time === undefined) {
+			// Do nothing the first time
+		} else if ((this.timed === undefined) || ((this.time + this.timed) > Date.now())) {
+			var key = this.current_vals;
+			if (!this.dynamic) {
+				key = this.get_key(key);
+			}
+			this.queue.push(key);
+			return
+		}
+	}
+	this.queue = [];
+	this.time = Date.now();
+    if(this.dynamic) {
+        this.dynamic_update(this.current_vals)
+        return;
+    }
+    var current = this.get_key(this.current_vals);
     this.current_frame = current;
     if(this.cached) {
         this.update(current)
@@ -147,13 +169,15 @@ function ScrubberWidget(frames, num_frames, id, interval, load_json, mode, cache
 	this.json_path = json_path;
     document.getElementById(this.slider_id).max = this.length - 1;
     this.init_slider(0);
+	this.wait = false;
+	this.queue = [];
 }
 
 ScrubberWidget.prototype = new HoloViewsWidget;
 
 ScrubberWidget.prototype.set_frame = function(frame){
-    this.current_frame = frame;
-    widget = document.getElementById(this.slider_id);
+	this.current_frame = frame;
+	widget = document.getElementById(this.slider_id);
     if (widget === null) {
         this.pause_animation();
         return
@@ -170,6 +194,7 @@ ScrubberWidget.prototype.set_frame = function(frame){
 ScrubberWidget.prototype.process_error = function(msg){
 	if (msg.content.ename === 'StopIteration') {
 		this.pause_animation();
+		this.stopped = true;
 		var keys = Object.keys(this.frames)
 		this.length = keys.length;
 		document.getElementById(this.slider_id).max = this.length-1;
@@ -192,6 +217,12 @@ ScrubberWidget.prototype.get_loop_state = function(){
 
 
 ScrubberWidget.prototype.next_frame = function() {
+	if (this.dynamic || !this.cached) {
+		if (this.wait) {
+			return
+		}
+		this.wait = true;
+	}
 	if (this.dynamic && this.current_frame + 1 >= this.length) {
 		this.length += 1;
         document.getElementById(this.slider_id).max = this.length-1;
@@ -224,7 +255,7 @@ ScrubberWidget.prototype.faster = function() {
 }
 
 ScrubberWidget.prototype.anim_step_forward = function() {
-    if(this.current_frame < this.length || this.dynamic){
+    if(this.current_frame < this.length || (this.dynamic && !this.stopped)){
         this.next_frame();
     }else{
         var loop_state = this.get_loop_state();