node.js integration and static image generation

bokeh/_templates/script_tag.html

@@ -5,6 +5,11 @@
 :type js_code: str
 
 #}
+{%- if docs_json_id -%}
+<script id="{{ docs_json_id }}" type="text/x-bokeh">
+    {{ docs_json|indent(4) }}
+</script>
+{% endif -%}
 <script type="text/javascript">
     {{ js_code }}
 </script>

bokeh/embed.py

@@ -409,18 +409,21 @@ def _script_for_render_items(docs_json, render_items, websocket_url,
     if (custom_models is not None) and len(custom_models) == 0:
         custom_models = None
 
-    plot_js = _wrap_in_function(
-        DOC_JS.render(
-            custom_models=custom_models,
-            websocket_url=websocket_url,
-            docs_json=serialize_json(docs_json),
-            render_items=serialize_json(render_items)
+    def plot_js(docs_json):
+        return _wrap_in_function(
+            DOC_JS.render(
+                custom_models=custom_models,
+                websocket_url=websocket_url,
+                docs_json=serialize_json(docs_json),
+                render_items=serialize_json(render_items),
+            )
         )
-    )
+
     if wrap_script:
-        return SCRIPT_TAG.render(js_code=plot_js)
+        id = str(uuid.uuid4())
+        return SCRIPT_TAG.render(docs_json_id=id, docs_json=serialize_json(docs_json), js_code=plot_js(id))
     else:
-        return plot_js
+        return plot_js(docs_json)
 
 def _html_page_for_render_items(resources, docs_json, render_items, title, websocket_url,
                                 custom_models, js_resources=None, css_resources=None,

bokehjs/package.json

@@ -56,7 +56,12 @@
     "shasum": "^1.0.1",
     "root-require": "^0.3.1",
     "event-stream": "^3.3.1",
-    "jsdom": "^5.6.1",
+    "jsdom": "^7.0.2",
+    "canvas": "^1.3.0",
+    "location": "^0.0.1",
+    "navigator": "^1.0.1",
+    "htmlparser2": "^3.8.3",
+    "uuid": "^2.0.1",
     "websocket":"^1.0.22"
   },
   "browserify": {

bokehjs/render.js

@@ -0,0 +1,93 @@
+var fs = require("fs");
+var path = require("path");
+var uuid = require("uuid");
+var argv = require("yargs").argv;
+var jsdom = require("jsdom");
+var htmlparser2 = require("htmlparser2");
+
+var all_models;
+var file = argv._[0];
+var ext = path.extname(file);
+var basename = path.basename(file, ext);
+var dirname = path.dirname(file);
+
+switch (ext) {
+  case ".html":
+    var all_texts = [];
+    var all_text = null;
+    var parser = new htmlparser2.Parser({
+      onopentag: function(name, attrs) {
+        if (name == "script" && attrs.type == "text/x-bokeh") {
+          all_text = "";
+        }
+      },
+      ontext: function(text) {
+        if (all_text !== null) {
+          all_text += text;
+        }
+      },
+      onclosetag: function(name) {
+        if (name == "script" && all_text !== null) {
+          all_texts.push(all_text);
+          all_text = null;
+        }
+      }
+    });
+    parser.write(fs.readFileSync(file));
+    parser.end();
+    switch (all_texts.length) {
+      case 0:
+        throw new Error("no 'text/x-bokeh' sections found");
+        break;
+      case 1:
+        all_models = JSON.parse(all_texts[0]);
+        break;
+      default:
+        throw new Error("too many 'text/x-bokeh' sections");
+    }
+    break;
+  case ".json":
+    all_models = require(file);
+    break;
+  default:
+    throw new Error("expected an HTML or JSON file");
+}
+
+global.document = jsdom.jsdom();
+global.window = document.defaultView;
+global.location = require("location");
+global.navigator = require("navigator");
+global.window.Canvas = require("canvas");
+global.window.Image = global.window.Canvas.Image;
+
+global.bokehRequire = require("./build/js/bokeh.js").bokehRequire;
+require("./build/js/bokeh-widgets.js");
+
+var Bokeh = global.window.Bokeh;
+
+var head = document.getElementsByTagName('head')[0];
+var link = document.createElement('link');
+link.rel = 'stylesheet';
+link.href = './build/css/bokeh.css';
+head.appendChild(link);
+
+Bokeh.set_log_level("debug");
+Bokeh.load_models(all_models);
+
+Bokeh.Collections("PlotContext").each(function(model) {
+  var el = document.createElement("div");
+  el.setAttribute("class", "plotdiv");
+  document.body.appendChild(el);
+
+  Bokeh.Events.on("render:done", function(plot_view) {
+    var nodeCanvas = plot_view.canvas_view.canvas[0]._nodeCanvas;
+    var name = basename + "-" + plot_view.model.id + ".png";
+    var outfile = path.join(dirname, name)
+    Bokeh.logger.info("writing " + outfile);
+    var out = fs.createWriteStream(outfile);
+    nodeCanvas.pngStream().on('data', function(chunk) { out.write(chunk); });
+  });
+
+  var view = new model.default_view({model: model, el: el});
+  Bokeh.index[model.id] = view;
+});

bokehjs/src/coffee/common/canvas.coffee

@@ -31,9 +31,7 @@ class CanvasView extends ContinuumView
     @canvas_overlay = @$('div.bk-canvas-overlays')
     @map_div = @$('div.bk-canvas-map') ? null
 
-    # Create context. This is the object that gets passed arount while drawing
-    @ctx = @canvas[0].getContext('2d')
-    @ctx.glcanvas = null  # init without webgl support (can be overriden in plot.coffee)
+    @ctx = @_get_context(@canvas[0])
 
     logger.debug("CanvasView initialized")
 
@@ -65,17 +63,26 @@ class CanvasView extends ContinuumView
     @canvas_events.attr('style', "z-index:100; position:absolute; top:0; left:0; width:#{width}px; height:#{height}px;")
     @canvas_overlay.attr('style', "z-index:75; position:absolute; top:0; left:0; width:#{width}px; height:#{height}px;")
 
+    if @canvas[0]._nodeCanvas?
+      @canvas[0]._nodeCanvas = new window.Canvas(width*ratio, height*ratio)
+      @ctx = @_get_context(@canvas[0])
+
     @ctx.scale(ratio, ratio)
     @ctx.translate(0.5, 0.5)
 
+    @model.new_bounds = false
+
+  _get_context: (canvas) ->
+    ctx = canvas.getContext('2d')
+    ctx.glcanvas = null           # init without webgl support (can be overriden in plot.coffee)
+
     # work around canvas incompatibilities
-    # todo: this is done ON EACH DRAW, is that intended?
-    @_fixup_line_dash(@ctx)
-    @_fixup_line_dash_offset(@ctx)
-    @_fixup_image_smoothing(@ctx)
-    @_fixup_measure_text(@ctx)
+    @_fixup_line_dash(ctx)
+    @_fixup_line_dash_offset(ctx)
+    @_fixup_image_smoothing(ctx)
+    @_fixup_measure_text(ctx)
 
-    @model.new_bounds = false
+    ctx
 
   _fixup_line_dash: (ctx) ->
     if (!ctx.setLineDash)
@@ -96,10 +103,10 @@ class CanvasView extends ContinuumView
 
   _fixup_image_smoothing: (ctx) ->
     ctx.setImageSmoothingEnabled = (value) ->
-      ctx.imageSmoothingEnabled = value;
-      ctx.mozImageSmoothingEnabled = value;
-      ctx.oImageSmoothingEnabled = value;
-      ctx.webkitImageSmoothingEnabled = value;
+      ctx.imageSmoothingEnabled = value
+      ctx.mozImageSmoothingEnabled = value
+      ctx.oImageSmoothingEnabled = value
+      ctx.webkitImageSmoothingEnabled = value
     ctx.getImageSmoothingEnabled = () ->
       return ctx.imageSmoothingEnabled ? true
 

bokehjs/src/coffee/common/embed.coffee

@@ -117,7 +117,19 @@ fill_render_item_from_script_tag = (script, item) ->
 
   logger.info("Will inject Bokeh script tag with params #{JSON.stringify(item)}")
 
-embed_items = (docs_json, render_items, websocket_url) ->
+embed_items = (docs_json_or_id, render_items, websocket_url) ->
+  if _.isString(docs_json_or_id)
+    element = document.getElementById(docs_json_or_id)
+    if not element
+      throw new Error("element ##{docs_json_or_id} not found")
+    if element.nodeName.toLowerCase() != "script" or element.getAttribute("type") != "text/x-bokeh"
+      throw new Error("element ##{docs_json_or_id} must be a script with type='text/x-bokeh'")
+    docs_json = JSON.parse(element.innerHTML)
+  else if _.isObject(docs_json_or_id)
+    docs_json = docs_json_or_id
+  else
+    throw new Error("expected a string identifier or an object")
+
   if websocket_url?
     set_websocket_url(websocket_url)
 

bokehjs/src/coffee/common/events.coffee

@@ -0,0 +1,7 @@
+Backbone = require "backbone"
+
+class Events extends Backbone.Events
+
+module.exports = {
+  Events: Events
+}

bokehjs/src/coffee/common/plot.coffee

@@ -17,6 +17,7 @@ Solver = require "./solver"
 ToolManager = require "./tool_manager"
 plot_template = require "./plot_template"
 properties = require "./properties"
+{Events} = require "./events"
 
 
 # Notes on WebGL support:
@@ -359,6 +360,8 @@ class PlotView extends ContinuumView
     # TODO - This should only be on in testing
     # @$el.find('canvas').attr('data-hash', ctx.hash());
 
+    Events.trigger("render:done", this)
+
   resize: () =>
     @resize_width_height(true, false)
 

bokehjs/src/coffee/main.coffee

@@ -24,6 +24,7 @@ Bokeh.index             = require("./common/base").index
 # common
 Bokeh.Collections       = require("./common/base").Collections
 Bokeh.Config            = require("./common/base").Config
+Bokeh.Events            = require("./common/events").Events
 Bokeh.Document          = require("./common/document").Document
 Bokeh.CartesianFrame    = require("./common/cartesian_frame")
 Bokeh.Canvas            = require("./common/canvas")

bokehjs/src/coffee/renderer/glyph/image_url.coffee

@@ -10,7 +10,7 @@ class ImageURLView extends Glyph.View
       @image = (null for img in @url)
 
     for i in [0...@url.length]
-      img = new Image()
+      img = new window.Image()
       img.onload = do (img, i) =>
         return () =>
           @image[i] = img

bokehjs/src/js/prelude.js

@@ -21,5 +21,9 @@
         newRequire(entry[i]);
     }
 
+    if (typeof exports !== "undefined") {
+      exports.bokehRequire = newRequire;
+    }
+
     return newRequire;
 })

conda.recipe/meta.yaml

@@ -65,6 +65,7 @@ test:
     - ipython-notebook
     - matplotlib
     - sympy
+    - scikit-learn
     - ggplot
     - seaborn
     - icalendar