Add option to combine events and support other events (#102)

* Add option to combine events

* Added docs

* Fixed linting issues

* Handle other events

* Fixed formatting

* Attempt to fix travis

* Fixed linting

* Fix for travis conda env

* Improve typing

Author: philippjfr

.travis.yml

@@ -6,15 +6,17 @@ cache:
 install:
 - wget https://repo.continuum.io/miniconda/Miniconda3-latest-Linux-x86_64.sh -O miniconda.sh
 - bash miniconda.sh -b -p $HOME/miniconda
-- export PATH="$HOME/miniconda/bin:$PATH"
+- source "$HOME/miniconda/etc/profile.d/conda.sh"
 - hash -r
 - conda config --set always_yes yes
 - conda config --set quiet yes
 - conda config --set changeps1 no
 - conda config --add channels bokeh
 - conda config --add channels conda-forge
+- conda update -q conda
 - conda info -a
-- conda install conda-build nodejs jupyterlab notebook
+- conda create -n test_env conda-build nodejs jupyterlab notebook
+- conda activate test_env
 - npm set progress false
 - npm install -g npm
 - conda build conda.recipe/

jupyter_bokeh/widgets.py

@@ -19,16 +19,17 @@
 
 # External imports
 from ipywidgets import DOMWidget
-from traitlets import Unicode, Dict
+from traitlets import Bool, Dict, Unicode
 
 # Bokeh imports
 from bokeh.core.json_encoder import serialize_json
-from bokeh.models import LayoutDOM
 from bokeh.document import Document
-from bokeh.protocol import Protocol
-from bokeh.util.dependencies import import_optional
 from bokeh.embed.elements import div_for_render_item
 from bokeh.embed.util import standalone_docs_json_and_render_items
+from bokeh.events import Event
+from bokeh.models import LayoutDOM
+from bokeh.protocol import Protocol
+from bokeh.util.dependencies import import_optional
 
 #-----------------------------------------------------------------------------
 # Globals and constants
@@ -55,6 +56,7 @@ class BokehModel(DOMWidget):
     _view_module = Unicode(_module_name).tag(sync=True)
     _view_module_version = Unicode(_module_version).tag(sync=True)
 
+    combine_events = Bool(False).tag(sync=True)
     render_bundle = Dict().tag(sync=True, to_json=lambda obj, _: serialize_json(obj))
 
     @property
@@ -104,15 +106,31 @@ def _document_patched(self, event):
     def _sync_model(self, _, content, _buffers):
         if content.get("event", "") != "jsevent":
             return
-        new, old, attr = content["new"], content["old"], content["attr"]
-        submodel = self._model.select_one({"id": content["id"]})
-        descriptor = submodel.lookup(content['attr'])
-        try:
-            descriptor._real_set(submodel, old, new, setter=self)
-        except Exception:
-            return
-        for cb in submodel._callbacks.get(attr, []):
-            cb(attr, old, new)
+        kind = content.get("kind")
+        if kind == 'ModelChanged':
+            hint = content.get("hint")
+            if hint:
+                cds = self._model.select_one({"id": hint["column_source"]["id"]})
+                if "patches" in hint:
+                    # Handle ColumnsPatchedEvent
+                    cds.patch(hint["patches"], setter=self)
+                elif "data" in hint:
+                    # Handle ColumnsStreamedEvent
+                    cds._stream(hint["data"], rollover=hint["rollover"], setter=self)
+                return
+
+            # Handle ModelChangedEvent
+            new, old, attr = content["new"], content["old"], content["attr"]
+            submodel = self._model.select_one({"id": content["id"]})
+            descriptor = submodel.lookup(content['attr'])
+            try:
+                descriptor._real_set(submodel, old, new, hint=hint, setter=self)
+            except Exception:
+                return
+            for cb in submodel._callbacks.get(attr, []):
+                cb(attr, old, new)
+        elif kind == 'MessageSent':
+            self._document.apply_json_event(content["msg_data"])
 
 #-----------------------------------------------------------------------------
 # Dev API

src/widgets.ts

@@ -27,6 +27,34 @@ export type RenderBundle = {
   div: string
 }
 
+export interface DocumentChanged {
+  event: "jsevent"
+  kind: string
+}
+
+export interface ModelChanged extends DocumentChanged {
+  event: "jsevent"
+  kind: "ModelChanged"
+  id: string
+  new: unknown
+  attr: string
+  old: unknown
+  hint: unknown
+}
+
+export interface MessageSent extends DocumentChanged {
+  event: "jsevent"
+  kind: "MessageSent"
+  msg_data: {
+    event_name: string,
+    event_values: {
+      model: {id: string},
+      [other: string]: any
+    }
+  }
+  msg_type: string
+}
+
 export class BokehModel extends DOMWidgetModel {
   defaults() {
     return {
@@ -40,6 +68,7 @@ export class BokehModel extends DOMWidgetModel {
       _view_module: name,
       _view_module_version: version_range,
 
+      combine_events: false,
       render_bundle: {},
     }
   }
@@ -53,17 +82,46 @@ export class BokehView extends DOMWidgetView {
   private _document: Document | null
   private _receiver: Receiver
   private _blocked: boolean
+  private _msgs: any[]
+  private _idle: boolean
+  private _combine: boolean
 
   constructor(options?: any) {
     super(options)
     this._document = null
     this._blocked = false
+    this._idle = true
+    this._combine = true
+    this._msgs = []
     const {Receiver} = bk_require("protocol/receiver")
     this._receiver = new Receiver()
     this.model.on("change:render_bundle", () => this.render())
+    if ((window as any).Jupyter != null && (window as any).Jupyter.notebook != null) {
+      // Handle classic Jupyter notebook
+      const events = (window as any).require('base/js/events')
+      events.on('kernel_idle.Kernel', () => this._process_msg())
+    } else if ((this.model.widget_manager as any).context != null) {
+      // Handle JupyterLab
+      (this.model.widget_manager as any).context.sessionContext.statusChanged.connect((_: any, status: any) => {
+        if (status === "idle")
+          this._process_msg()
+      })
+    } else {
+      if (this.model.get("combine_events"))
+        console.warn("BokehView cannot combine events because Kernel idle status cannot be determined.")
+      this._combine = false
+    }
     this.listenTo(this.model, "msg:custom", (content, buffers) => this._consume_patch(content, buffers))
   }
 
+  protected _process_msg(): void {
+    if (this._msgs.length == 0) {
+      this._idle = true
+      return
+    }
+    this.send(this._msgs.shift())
+  }
+
   render(): void {
     const bundle = JSON.parse(this.model.get("render_bundle"))
     const {docs_json, render_items, div} = bundle as RenderBundle
@@ -82,10 +140,77 @@ export class BokehView extends DOMWidgetView {
     this._document.on_change((event: any) => this._change_event(event))
   }
 
+  _combine_events(new_msg: (ModelChanged | MessageSent)): (ModelChanged | MessageSent)[] {
+    const new_msgs = []
+    for (const msg of this._msgs) {
+      if (new_msg.kind != msg.kind)
+        new_msgs.push(msg)
+      else if (msg.kind == "ModelChanged" && new_msg.kind == "ModelChanged") {
+        if (msg.id != new_msg.id || msg.attr != new_msg.attr)
+          new_msgs.push(msg)
+      } else if (msg.kind == "MessageSent" && new_msg.kind == "MessageSent") {
+        if (
+          msg.msg_data.event_values.model.id != new_msg.msg_data.event_values.model.id ||
+          msg.msg_data.event_name != new_msg.msg_data.event_name
+        )
+          new_msgs.push(msg)
+      }
+    }
+    new_msgs.push(new_msg)
+    return new_msgs
+  }
+
+  _send(msg: (ModelChanged | MessageSent)): void {
+    if (!this._idle && this._combine && this.model.get("combine_events"))
+      // Queue event and drop previous events on same model attribute
+      this._msgs = this._combine_events(msg)
+    else {
+      this._idle = false
+      this.send(msg)
+    }
+  }
+
   protected _change_event(event: DocumentChangedEvent): void {
-    const {ModelChangedEvent} = bk_require("document/events")
-    if (!this._blocked && event instanceof ModelChangedEvent)
-      this.send({event: "jsevent", id: event.model.id, new: event.new_, attr: event.attr, old: event.old})
+    if (this._blocked) { return }
+    const {ModelChangedEvent, MessageSentEvent} = bk_require("document/events")
+    if (event instanceof ModelChangedEvent) {
+      const js_msg: ModelChanged = {
+        event: "jsevent",
+        kind: "ModelChanged",
+        id: event.model.id,
+        attr: event.attr,
+        new: event.new_,
+        old: event.old,
+        hint: null,
+      }
+      if (event.hint != null) {
+        if (event.hint.patches != null) {
+          js_msg["hint"] = {
+            column_source: event.hint.column_source,
+            patches: event.hint.patches,
+          }
+        } else if (event.hint.data != null) {
+          js_msg["hint"] = {
+            column_source: event.hint.column_source,
+            data: event.hint.data,
+            rollover: event.hint.rollover,
+          }
+        }
+      }
+      this._send(js_msg)
+    } else if ((event instanceof MessageSentEvent) && (event.msg_type == "bokeh_event")) {
+      const msg_data = {...event.msg_data}
+      const event_values = {...msg_data.event_values}
+      event_values["model"] = {id: event_values.model.id}
+      msg_data["event_values"] = event_values
+      const js_msg: MessageSent = {
+        event: "jsevent",
+        kind: "MessageSent",
+        msg_type: event.msg_type,
+        msg_data: msg_data,
+      }
+      this._send(js_msg)
+    }
   }
 
   protected _consume_patch(content: {msg: "patch", payload?: Fragment}, buffers: DataView[]): void {