Enable Bokeh and other jupyterlab rendermime extensions

[robmarkcole]

It would be great to enable Bokeh plots. Currently:

[robmarkcole]

Seconds thoughts, this rather duplicates functionality and could be confusing for users. Discard suggestion

[SimonBiggs]

Actually, I'd be happy to enable JavaScript... We would then just get bokeh.

[SimonBiggs]

The bokeh interactive plots are lovely and would be a great fit.

[SimonBiggs]

I was also considering making to so that if

```javascript
Code is written here
```

Then run it as JavaScript code...

[SimonBiggs]

That will also help me write the docs which will be nice. As I can write the docs using scriptedforms files, and still have them run online without a server because I'll run the code with JavaScript instead of Python.

[SimonBiggs]

If I do implement it, it might not be simple to sync variables up... I'll have to think about that.

[robmarkcole]

One issue to consider is whether Javascript will display in all browsers. For example, Bokeh plots do not display on my ipad pro

[SimonBiggs]

That's fine. The creators of the form can choose those pros/cons. I haven't even begun using Sauce Labs yet to produce the compatibility table of ScriptedForms. ScriptedForms itself might not even run on your iPad, I don't know.

[SimonBiggs]

The majority of ScriptedForms is a hunky piece of JavaScript

[SimonBiggs]

I have thought further about this and I will wait to make a decision on this. I think it would be best waiting until after ScriptedForms is integrated within jupyterlab.

I will leave it open because I want bokeh to work. I think bokeh will be great, I'll just set it to 1.0.0

[SimonBiggs]

@robmarkcole so, to make pivot table work I enabled JavaScript, and made a few addition to how the server finds files. Potentially this could also have made bokeh and other notebook JavaScript extensions work. If you want to try a few of them and report back to me that'd be great. (Bokeh, holoviews, plotly etc.)

[robmarkcole]

For scriptedforms==0.6.6 Bokeh gives:

https://raw.githubusercontent.com/robmarkcole/Useful-python/master/scriptedforms/Bokeh_scripted/bokeh.md

[SimonBiggs]

Okay. Well I'll have to look into that separately then...

On Thu, 8 Mar 2018 at 07:28 Robin notifications@github.com wrote:

For scriptedforms==0.6.6 Bokeh gives:

[image: image] https://user-images.githubusercontent.com/11855322/37116357-f3b9c964-2245-11e8-8813-f58f2f87608e.png

https://raw.githubusercontent.com/robmarkcole/Useful-python/master/scriptedforms/Bokeh_scripted/bokeh.md

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/SimonBiggs/scriptedforms/issues/126#issuecomment-371273654, or mute the thread https://github.com/notifications/unsubscribe-auth/AGQVe1063d4I0D95QzH-WJyP5My_fOMGks5tcELlgaJpZM4SZ8vs .

[ricky-lim]

For altair package, the similar error is also shown on scriptedforms(0.9.2).

Would it be considered to enable javascript to show altair charts?

JavaScript output is disabled in JupyterLab

Thanks in advance.

[SimonBiggs]

Cheers for the idea. I actually dabbled with that early on. See the following comment:

https://github.com/SimonBiggs/scriptedforms/issues/105#issuecomment-371422732

It ended up being quite painful to maintain. There was all sorts of awkward assumptions being made by the package that I had to dance around.

Not sure if that's the same with Altair, but I think the best way forward here is for me to support jupyterlab extensions out of the box.

[SimonBiggs]

Also, to add to that. I actually am not blocking JavaScript:

https://github.com/SimonBiggs/scriptedforms/blob/2f18bc496b58b34019f134f89afd2334c5c77834/scriptedforms/src/app/code-module/code.component.ts#L46

That line of code undoes the stripping of script tags that jupyterlab does by default. So strictly JavaScript is now enabled.

It appears though if ever the "mime type" is JavaScript the following display is used:

https://github.com/jupyterlab/jupyterlab/blob/b96a2289269818ca808be1be5a38456d3297f734/packages/rendermime/src/widgets.ts#L384

It looks like I would have to replace that.

[ricky-lim]

Thank you for the swift reply.

A bit of a side-track, when I tried to embed an altair chart as HTML (as shown below),

<section-start>
from IPython.display import display, HTML

test_altair = """
  <div id="vis"></div>
  <script>
    const spec = {
  "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
  "description": "A simple bar chart with embedded data.",
  "width": 360,
  "data": {
    "values": [
      {"a": "A","b": 28}, {"a": "B","b": 55}, {"a": "C","b": 43},
      {"a": "D","b": 91}, {"a": "E","b": 81}, {"a": "F","b": 53},
      {"a": "G","b": 19}, {"a": "H","b": 87}, {"a": "I","b": 52}
    ]
  },
  "mark": "bar",
  "encoding": {
    "x": {"field": "a", "type": "ordinal"},
    "y": {"field": "b", "type": "quantitative"},
    "tooltip": {"field": "b", "type": "quantitative"}
  }
}
    vegaEmbed('#vis', spec, {defaultStyle: true}).catch(console.warn);
  </script>
"""
display(HTML(test_altair))
</section-start>

It does not render the chart and peeking into the console, I found a message JupyterLab does not execute inline JavaScript in HTML output

Could you give any advice or a pointer, please?

Thanks in advance.

Cheers

[SimonBiggs]

Yeah, it appears there are multiple layers of "Will not execute arbitrary JS" built into JLab. I gave it a quick try to see what I could achieve just now and I was able to replicate your issue. Unfortunately it appears that it will not be simple for me to enable this.