Add support for plotly with thebelab

extra_markdown.tpl

 {% extends 'markdown.tpl' %}
 
-{%- block data_other -%}
-{%- for type in output.data | filter_data_type -%}
-{%- if type == 'application/vnd.plotly.v1+json' -%}
-{%- set fname = output.metadata.filenames['application/vnd.plotly.v1+json'] -%}
-{%- set plotly_url = fname | path2url -%}
-{%- set div_id = fname.split('/') | last -%}
-<div id="{{div_id}}"><img ></img></div>
-
-<script>
-window.addEventListener('load', function() {
-  Plotly.d3.json('../{{plotly_url}}', function(error, fig) {
-    Plotly.plot('{{div_id}}', fig.data, fig.layout).then(
-      function(value) {Plotly.relayout('{{div_id}}', {height: ' '})}
-    );
-  });
-});
-</script>
-{%- endif -%}
-{%- endfor -%}
-{%- endblock -%}
-
 {% block input %}
 {% if cell.metadata.attributes and cell.metadata.attributes.initialize %}
 <div class="thebelab-init-code">
@@ -31,9 +10,23 @@ window.addEventListener('load', function() {
 {% endif %}
 {% endblock %}
 
-{% block data_priority %}
-{% if cell.metadata.attributes and cell.metadata.attributes.editable == 'false' %}
+{% block display_data %}
+{% if cell.metadata.attributes and cell.metadata.attributes.editable == 'false' and not cell.metadata.attributes.plotly %}
 {{ super() }}
+{% elif cell.metadata.attributes and cell.metadata.attributes.plotly %}
+<div class="thebelab-init-code">
+  <pre class="thebelab-code" data-executable="true" data-language="python">
+    {{cell.source}}
+  </pre>
+</div>
+<div>
+{{ output.data['text/html'] }}
+</div>
+{% elif output.data['text/html'] %}
+<pre class="thebelab-code" data-executable="true" data-language="python">{{cell.source}}</pre>
+<div class="thebelab-output" data-output="true">
+{{ output.data['text/html'] }}
+</div>
 {% else %}
 <pre class="thebelab-code" data-executable="true" data-language="python">{{cell.source}}</pre>
 <div class="thebelab-output" data-output="true" markdown="1">
@@ -45,8 +38,3 @@ window.addEventListener('load', function() {
 {% block error %}
 {% endblock error %}
 
-{% block stream %}
-{%- if output.name == 'stdout' -%}
-{{ output.text | indent }}
-{%- endif -%}
-{% endblock stream %}

src/12_band_structures_in_higher_dimensions.md

@@ -6,6 +6,10 @@ import plotly.graph_objs as go
 pi = np.pi
 ```
 
+```{python plotly=true}
+py.init_notebook_mode(connected=True)
+```
+
 # Tight binding and nearly free electrons
 _(based on chapters 15–16 of the book)_  
 

src/1_einstein_model.md

@@ -28,6 +28,10 @@ from common import draw_classic_axes, configure_plotting
 configure_plotting()
 ```
 
+```{python plotly=true}
+py.init_notebook_mode(connected=True)
+```
+
 _(based on chapter 2.1 of the book)_
 
 !!! summary "Learning goals"
@@ -43,7 +47,8 @@ _(based on chapter 2.1 of the book)_
 
 Let us look at the heat capacities of different chemical elements[^1]:
 
-```{python editable=false}
+```python
+
 elements = pandas.read_json('elements.json')
 elements.full_name = elements.full_name.str.capitalize()
 hovertext = elements.T.apply(

src/9_crystal_structure.md

@@ -26,6 +26,10 @@ import plotly.graph_objs as go
 configure_plotting()
 ```
 
+```{python plotly=true}
+py.init_notebook_mode(connected=True)
+```
+
 # Lecture 9 – Crystal structure
 
 _based on chapter 12 of the book_  

theme/main.html

@@ -40,6 +40,12 @@
 {{ super() }}
 {% endblock %}
 
+{% block libs %}
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js" type="text/javascript"></script>
+{{ super() }}
+{% endblock %}
+
 {% block content %}
 {% if 'thebelab-code' in super() %}
 {{ super() | replace('</h1>', '</h1> <button id="thebelab-activate-button" class="thebelab-button" onclick="initThebelab()">Make live</button>', count=1) }}