started IJulia integration, corrected Escher replotting issue

queryverse · Mar 13, 2016 · b42de82 · b42de82
1 parent ba627dd
commit b42de82
Show file tree

Hide file tree

Showing 7 changed files with 213 additions and 45 deletions.
diff --git a/LICENSE b/LICENSE
@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2016 Frédéric Testard
+Copyright (c) 2016 John Myles White, Randy Zwitch & Frédéric Testard
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

diff --git a/REQUIRE b/REQUIRE
@@ -1,2 +1,3 @@
 julia 0.4
+Compat
 JSON
diff --git a/assets/vega-lite.html b/assets/vega-lite.html
@@ -6,7 +6,7 @@
 
   <dom-module id="vega-lite-plot">
     <template>
-      <div id="plot">
+      <div>
           <content></content>
       </div>
     </template>
@@ -18,23 +18,24 @@
             type: Object,
             notify: true,
             observer: 'render'
-          }
+          },
+          svg: Boolean,
+          actions: Boolean
         },
 
         render: function() {
           var embedSpec = {
             mode: "vega-lite",
+            renderer: this.svg ? "svg" : "canvas",
+            actions: false, //this.actions,
             spec: this.json
           }
-          vg.embed("#plot", embedSpec, function(error, result) {
-            result.view.renderer("svg")
-            // Callback receiving the View instance and parsed Vega spec
-            // result.view is the View, which resides under the '#vis' element
+          vg.embed(this, embedSpec, function(error, result) {
           });
 
         },
 
-        ready: function (){
+        attached: function (){
           this.render()
         },
 

diff --git a/src/VegaLite.jl b/src/VegaLite.jl
@@ -2,7 +2,7 @@
 
 module VegaLite
 
-    using JSON
+    using JSON, Compat
 
     import Base: +, *, scale, show
 

diff --git a/src/escher_integration.jl b/src/escher_integration.jl
@@ -1,12 +1,33 @@
 import Escher: Elem, Tile, render
 import Base: convert
 
+ESCHER_SVG = true
+ESCHER_BUTTONS = true
+
+export svg, buttons
+
+svg() = ESCHER_SVG
+svg(b::Bool) = (global ESCHER_SVG ; ESCHER_SVG = b)
+buttons() = ESCHER_BUTTONS
+buttons(b::Bool) = (global ESCHER_BUTTONS ; ESCHER_BUTTONS = b)
+
+
 type VegaLiteTile <: Tile
-    json::AbstractString
+  json::AbstractString
+  svg::Bool
+  actions::Bool
+end
+
+function VegaLiteTile(vis::AbstractString)
+  VegaLiteTile(vis, ESCHER_SVG, ESCHER_BUTTONS)
 end
 
-# convert(::Type{Tile}, v::VegaLiteVis) = VegaLiteTile(JSON.json(tojs(v)))
 convert(::Type{Tile}, v::VegaLiteVis) = VegaLiteTile(JSON.json(v.vis))
 
-render(plot::VegaLiteTile, state) =
-    Elem(:"vega-lite-plot", attributes = Dict(:json=>plot.json))
+function render(plot::VegaLiteTile, state)
+  attr = Dict(:json=>plot.json)
+  plot.svg     && ( attr[:svg]     = "" )
+  plot.actions && ( attr[:actions] = "" )
+
+  Elem(:"vega-lite-plot", attributes = attr)
+end
diff --git a/src/render.jl b/src/render.jl
@@ -1,47 +1,46 @@
 
-asset(url...) = readall(Pkg.dir("VegaLite", "assets", "bower_components", url...))
+asset(url...) = @compat readstring(Pkg.dir("VegaLite", "assets", "bower_components", url...))
 
 #Vega Scaffold: https://github.com/vega/vega/wiki/Runtime
 function writehtml(io::IO, v::VegaLiteVis; title="Vega.jl Visualization")
+  d3          = asset("d3","d3.min.js")
+  vega        = asset("vega", "vega.js")
+  vegalite    = asset("vega-lite", "vega-lite.js")
+  vegaembed   = asset("vega-embed", "vega-embed.js")
 
-    d3          = asset("d3","d3.min.js")
-    vega        = asset("vega", "vega.js")
-    vegalite    = asset("vega-lite", "vega-lite.js")
-    vegaembed   = asset("vega-embed", "vega-embed.js")
+  divid = "vg" * randstring(3)
 
-    divid = "vg" * randstring(3)
+  println(io,
+  """
+  <html>
+    <head>
+      <title>$title</title>
+      <script>$d3</script>
+      <script>$vega</script>
+      <script>$vegalite</script>
+      <script>$vegaembed</script>
 
-    println(io,
-    """
-    <html>
-      <head>
-        <title>$title</title>
-        <script>$d3</script>
-        <script>$vega</script>
-        <script>$vegalite</script>
-        <script>$vegaembed</script>
+    </head>
+    <body>
+      <div id="$divid"></div>
+    </body>
 
-      </head>
-      <body>
-        <div id="$divid"></div>
-      </body>
+  <script type="text/javascript">
 
-    <script type="text/javascript">
-
-    var embedSpec = {
-      mode: "vega-lite",
-      spec: $(JSON.json(v.vis))
-    }
+  var embedSpec = {
+    mode: "vega-lite",
+    spec: $(JSON.json(v.vis))
+  }
 
-    vg.embed("#$divid", embedSpec, function(error, result) {
-      result.view.renderer("svg")
-    });
+  vg.embed("#$divid", embedSpec, function(error, result) {
+    result.view.renderer("svg")
+  });
 
-    </script>
+  </script>
 
 
-    </html>
-    """)
+  </html>
+  """)
 end
 
 function show(io::IO, v::VegaLiteVis)
@@ -59,8 +58,153 @@ function show(io::IO, v::VegaLiteVis)
         @osx_only     run(`open $tmppath`)
         @windows_only run(`cmd /c start $tmppath`)
         @linux_only   run(`xdg-open $tmppath`)
-
     end
 
     return
 end
+
+###################################################
+
+import Base.writemime
+
+# asset(url...) = readall(Pkg.dir("Vega", "assets", "bower_components", url...))
+
+# function writemime(io::IO, ::MIME"text/html", v::VegaVisualization)
+#     divid = "vg" * randstring(3)
+#     script_contents = scriptstr(v, divid)
+#     display("text/html", """
+#     <body>
+#     <div id=\"$divid\"></div>
+#     </body>
+#     <script type="text/javascript">
+#         $script_contents
+#     </script>
+#     """)
+# end
+#
+import Patchwork: Elem
+
+# function patchwork_repr(v::VegaLiteVis)
+#     divid = "vg" * randstring(3)
+#     script_contents = scriptstr(v, divid)
+#     Elem(:div, [
+#         Elem(:div, "") & Dict(:id=>divid, :style=>Dict("min-height"=>"$(v.height + 110)px")),
+#         Elem(:script, script_contents) & Dict(:type=>"text/javascript")
+#     ])
+# end
+
+# function writemime(io::IO, m::MIME"text/html", v::VegaLiteVis)
+#
+#
+#   fh = """
+#   <div>
+#     <script src="bower_components/d3/d3.min.js" charset="utf-8"></script>
+#     <script src="bower_components/vega/vega.js" charset="utf-8"></script>
+#     <script src="bower_components/vega-lite/vega-lite.js" charset="utf-8"></script>
+#     <script src="bower_components/vega-embed/vega-embed.js" charset="utf-8"></script>
+#
+#     <dom-module id="vega-lite-plot">
+#       <template>
+#         <div>
+#             <content></content>
+#         </div>
+#       </template>
+#       <script>
+#         Polymer({
+#           is: "vega-lite-plot",
+#           properties: {
+#             json: {
+#               type: Object,
+#               notify: true,
+#               observer: 'render'
+#             },
+#             svg: Boolean,
+#             actions: Boolean
+#           },
+#
+#           render: function() {
+#             var embedSpec = {
+#               mode: "vega-lite",
+#               renderer: this.svg ? "svg" : "canvas",
+#               actions: false, //this.actions,
+#               spec: this.json
+#             }
+#             vg.embed(this, embedSpec, function(error, result) {
+#             });
+#
+#           },
+#
+#           attached: function (){
+#             this.render()
+#           },
+#
+#         });
+#       </script>
+#     </dom-module>
+#
+#     <vega-lite-plot json="$(v.vis)" svg ></vega-lite-plot>
+#
+#   </div>
+#   """
+#
+#   # writemime(io, m, fh)
+#   write(io, fh)
+# end
+
+jspath(url...) = Pkg.dir("VegaLite", "assets", "bower_components", url...)
+
+function writemime(io::IO, m::MIME"text/html", v::VegaLiteVis)
+  # fh = """
+  # <div>
+  #   <script src="$(jspath("d3","d3.min.js"))" charset="utf-8"></script>
+  #   <script src="$(jspath("vega", "vega.js"))" charset="utf-8"></script>
+  #   <script src="$(jspath("vega-lite", "vega-lite.js"))" charset="utf-8"></script>
+  #   <script src="$(jspath("vega-embed", "vega-embed.js"))" charset="utf-8"></script>
+
+    fh = """
+    <div>
+
+    <div id="plot">
+      <content></content>
+    </div>
+
+
+
+    <script type="text/javascript">
+
+      require.config({
+        paths: {
+          d3: "$(jspath("d3","d3.min.js"))",
+          vega: "$(jspath("vega", "vega.js"))",
+          vegalite: "$(jspath("vega-lite", "vega-lite.js"))",
+          vegaembed: "$(jspath("vega-embed", "vega-embed.js"))"
+        }
+      });
+
+      require(["d3", "vega", "vegalite", "vegaembed"],
+              function(d3, vg, vgl, vge){
+        // window.d3 = d3;
+
+        var embedSpec = {
+          mode: "vega-lite",
+          renderer: "svg",
+          actions: false,
+          spec: $(JSON.json(v.vis))
+        }
+
+        vg.embed("#plot", embedSpec, function(error, result) {
+        });
+      });
+
+    </script>
+
+  </div>
+  """
+
+  println(fh)
+  # writemime(io, m, fh)
+  write(io, fh)
+end
+
+
+export writemime
diff --git a/test/REQUIRE b/test/REQUIRE
@@ -1,3 +1,4 @@
 julia 0.4
 JSON
 RDatasets
+Compat