base.html.j2 9.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331
  1. {%- extends 'display_priority.j2' -%}
  2. {% from 'celltags.j2' import celltags %}
  3. {% from 'cell_id_anchor.j2' import cell_id_anchor %}
  4. {% block codecell %}
  5. {%- if not cell.outputs -%}
  6. {%- set no_output_class="jp-mod-noOutputs" -%}
  7. {%- endif -%}
  8. {%- if not resources.global_content_filter.include_input -%}
  9. {%- set no_input_class="jp-mod-noInput" -%}
  10. {%- endif -%}
  11. <div {{ cell_id_anchor(cell) }} class="jp-Cell jp-CodeCell jp-Notebook-cell {{ no_output_class }} {{ no_input_class }} {{ celltags(cell) }}">
  12. {{ super() }}
  13. </div>
  14. {%- endblock codecell %}
  15. {% block input_group -%}
  16. <div class="jp-Cell-inputWrapper">
  17. <div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
  18. </div>
  19. <div class="jp-InputArea jp-Cell-inputArea">
  20. {{ super() }}
  21. </div>
  22. </div>
  23. {% endblock input_group %}
  24. {% block input %}
  25. <div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
  26. <div class="cm-editor cm-s-jupyter">
  27. {{ cell.source | highlight_code(metadata=cell.metadata) | clean_html }}
  28. </div>
  29. </div>
  30. {%- endblock input %}
  31. {% block output_group %}
  32. <div class="jp-Cell-outputWrapper">
  33. <div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
  34. </div>
  35. {{ super() }}
  36. </div>
  37. {% endblock output_group %}
  38. {% block outputs %}
  39. <div class="jp-OutputArea jp-Cell-outputArea">
  40. {{ super() }}
  41. </div>
  42. {% endblock outputs %}
  43. {% block in_prompt -%}
  44. <div class="jp-InputPrompt jp-InputArea-prompt">
  45. {%- if cell.execution_count is defined -%}
  46. In&nbsp;[{{ cell.execution_count|replace(None, "&nbsp;") }}]:
  47. {%- else -%}
  48. In&nbsp;[&nbsp;]:
  49. {%- endif -%}
  50. </div>
  51. {%- endblock in_prompt %}
  52. {% block empty_in_prompt -%}
  53. <div class="jp-InputPrompt jp-InputArea-prompt">
  54. </div>
  55. {%- endblock empty_in_prompt %}
  56. {#
  57. output_prompt doesn't do anything in HTML,
  58. because there is a prompt div in each output area (see output block)
  59. #}
  60. {% block output_prompt %}
  61. {% endblock output_prompt %}
  62. {% block output_area_prompt %}
  63. <div class="jp-OutputPrompt jp-OutputArea-prompt">
  64. {%- if output.output_type == 'execute_result' -%}
  65. {%- if cell.execution_count is defined -%}
  66. Out[{{ cell.execution_count|replace(None, "&nbsp;") }}]:
  67. {%- else -%}
  68. Out[&nbsp;]:
  69. {%- endif -%}
  70. {%- endif -%}
  71. </div>
  72. {% endblock output_area_prompt %}
  73. {% block output %}
  74. {%- if output.output_type == 'execute_result' -%}
  75. <div class="jp-OutputArea-child jp-OutputArea-executeResult">
  76. {%- else -%}
  77. <div class="jp-OutputArea-child">
  78. {%- endif -%}
  79. {% if resources.global_content_filter.include_output_prompt %}
  80. {{ self.output_area_prompt() }}
  81. {% endif %}
  82. {{ super() }}
  83. </div>
  84. {% endblock output %}
  85. {% block markdowncell scoped %}
  86. <div {{ cell_id_anchor(cell) }} class="jp-Cell jp-MarkdownCell jp-Notebook-cell">
  87. <div class="jp-Cell-inputWrapper">
  88. <div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
  89. </div>
  90. <div class="jp-InputArea jp-Cell-inputArea">
  91. {%- if resources.global_content_filter.include_input_prompt-%}
  92. {{ self.empty_in_prompt() }}
  93. {%- endif -%}
  94. <div class="jp-RenderedHTMLCommon jp-RenderedMarkdown jp-MarkdownOutput {{ celltags(cell) }}" data-mime-type="text/markdown">
  95. {%- if resources.should_sanitize_html %}
  96. {%- set html_value=cell.source | markdown2html | strip_files_prefix | clean_html -%}
  97. {%- else %}
  98. {%- set html_value=cell.source | markdown2html | strip_files_prefix -%}
  99. {%- endif %}
  100. {{ html_value }}
  101. </div>
  102. </div>
  103. </div>
  104. </div>
  105. {%- endblock markdowncell %}
  106. {% block rawcell scoped %}
  107. {%- if cell.metadata.get('raw_mimetype', '').lower() in resources.get('raw_mimetypes', ['']) -%}
  108. {{ cell.source | clean_html }}
  109. {%- endif -%}
  110. {%- endblock rawcell %}
  111. {% block unknowncell scoped %}
  112. unknown type {{ cell.type }}
  113. {% endblock unknowncell %}
  114. {% block execute_result -%}
  115. {%- set extra_class="jp-OutputArea-executeResult" -%}
  116. {% block data_priority scoped %}
  117. {{ super() }}
  118. {% endblock data_priority %}
  119. {%- set extra_class="" -%}
  120. {%- endblock execute_result %}
  121. {% block stream_stdout -%}
  122. <div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain">
  123. <pre>
  124. {{- output.text | ansi2html -}}
  125. </pre>
  126. </div>
  127. {%- endblock stream_stdout %}
  128. {% block stream_stderr -%}
  129. <div class="jp-RenderedText jp-OutputArea-output" data-mime-type="application/vnd.jupyter.stderr">
  130. <pre>
  131. {{- output.text | ansi2html -}}
  132. </pre>
  133. </div>
  134. {%- endblock stream_stderr %}
  135. {% block stream_stdin -%}
  136. {%- if resources.global_content_filter.include_output_stdin -%}
  137. <div class="jp-RenderedText jp-OutputArea-output" data-mime-type="application/vnd.jupyter.stdin">
  138. <pre>
  139. {{- output.text | ansi2html -}}
  140. </pre>
  141. </div>
  142. {%- endif %}
  143. {%- endblock stream_stdin %}
  144. {% block data_svg scoped -%}
  145. <div class="jp-RenderedSVG jp-OutputArea-output {{ extra_class }}" data-mime-type="image/svg+xml">
  146. {%- if output.svg_filename %}
  147. <img src="{{ output.svg_filename | posix_path | escape_html }}">
  148. {%- else %}
  149. {%- if resources.should_not_encode_svg %}
  150. {{ output.data['image/svg+xml'].encode("utf-8") | clean_html }}
  151. {%- else %}
  152. <img src="data:image/svg+xml;base64,{{ output.data['image/svg+xml'] | text_base64 | escape_html }}">
  153. {%- endif %}
  154. {%- endif %}
  155. </div>
  156. {%- endblock data_svg %}
  157. {% block data_mermaid scoped -%}
  158. <div class="jp-Mermaid">
  159. <pre class="mermaid">
  160. {{ output.data['text/vnd.mermaid'].strip() }}
  161. </pre>
  162. </div>
  163. {%- endblock data_mermaid %}
  164. {% block data_html scoped -%}
  165. <div class="jp-RenderedHTMLCommon jp-RenderedHTML jp-OutputArea-output {{ extra_class }}" data-mime-type="text/html">
  166. {%- if resources.should_sanitize_html %}
  167. {{ output.data['text/html'] | clean_html }}
  168. {%- else %}
  169. {{ output.data['text/html'] }}
  170. {%- endif %}
  171. </div>
  172. {%- endblock data_html %}
  173. {% block data_markdown scoped -%}
  174. {%- if resources.should_sanitize_html %}
  175. {%- set html_value=output.data['text/markdown'] | markdown2html | clean_html -%}
  176. {%- else %}
  177. {%- set html_value=output.data['text/markdown'] | markdown2html -%}
  178. {%- endif %}
  179. <div class="jp-RenderedHTMLCommon jp-RenderedMarkdown jp-OutputArea-output {{ extra_class }}" data-mime-type="text/markdown">
  180. {{ html_value }}
  181. </div>
  182. {%- endblock data_markdown %}
  183. {% block data_png scoped %}
  184. <div class="jp-RenderedImage jp-OutputArea-output {{ extra_class }}">
  185. {%- if 'image/png' in output.metadata.get('filenames', {}) %}
  186. <img src="{{ output.metadata.filenames['image/png'] | posix_path | escape_html }}"
  187. {%- else %}
  188. <img src="data:image/png;base64,{{ output.data['image/png'] | escape_html }}"
  189. {%- endif %}
  190. {%- set width=output | get_metadata('width', 'image/png') -%}
  191. {%- if width is not none %}
  192. width={{ width | escape_html }}
  193. {%- endif %}
  194. {%- set height=output | get_metadata('height', 'image/png') -%}
  195. {%- if height is not none %}
  196. height={{ height | escape_html }}
  197. {%- endif %}
  198. class="
  199. {%- if output | get_metadata('unconfined', 'image/png') %}
  200. unconfined
  201. {%- endif %}
  202. {%- if output | get_metadata('needs_background', 'image/png') == 'light' %}
  203. jp-needs-light-background
  204. {%- endif %}
  205. {%- if output | get_metadata('needs_background', 'image/png') == 'dark' %}
  206. jp-needs-dark-background
  207. {%- endif %}
  208. "
  209. >
  210. </div>
  211. {%- endblock data_png %}
  212. {% block data_jpg scoped %}
  213. <div class="jp-RenderedImage jp-OutputArea-output {{ extra_class }}">
  214. {%- if 'image/jpeg' in output.metadata.get('filenames', {}) %}
  215. <img src="{{ output.metadata.filenames['image/jpeg'] | posix_path | escape_html }}"
  216. {%- else %}
  217. <img src="data:image/jpeg;base64,{{ output.data['image/jpeg'] | escape_html }}"
  218. {%- endif %}
  219. {%- set width=output | get_metadata('width', 'image/jpeg') -%}
  220. {%- if width is not none %}
  221. width={{ width | escape_html }}
  222. {%- endif %}
  223. {%- set height=output | get_metadata('height', 'image/jpeg') -%}
  224. {%- if height is not none %}
  225. height={{ height | escape_html }}
  226. {%- endif %}
  227. class="
  228. {%- if output | get_metadata('unconfined', 'image/jpeg') %}
  229. unconfined
  230. {%- endif %}
  231. {%- if output | get_metadata('needs_background', 'image/jpeg') == 'light' %}
  232. jp-needs-light-background
  233. {%- endif %}
  234. {%- if output | get_metadata('needs_background', 'image/jpeg') == 'dark' %}
  235. jp-needs-dark-background
  236. {%- endif %}
  237. "
  238. >
  239. </div>
  240. {%- endblock data_jpg %}
  241. {% block data_latex scoped %}
  242. <div class="jp-RenderedLatex jp-OutputArea-output {{ extra_class }}" data-mime-type="text/latex">
  243. {{ output.data['text/latex'] | e }}
  244. </div>
  245. {%- endblock data_latex %}
  246. {% block error -%}
  247. <div class="jp-RenderedText jp-OutputArea-output" data-mime-type="application/vnd.jupyter.stderr">
  248. <pre>
  249. {{- super() -}}
  250. </pre>
  251. </div>
  252. {%- endblock error %}
  253. {%- block traceback_line %}
  254. {{ line | ansi2html }}
  255. {%- endblock traceback_line %}
  256. {%- block data_text scoped %}
  257. <div class="jp-RenderedText jp-OutputArea-output {{ extra_class }}" data-mime-type="text/plain">
  258. <pre>
  259. {{- output.data['text/plain'] | ansi2html -}}
  260. </pre>
  261. </div>
  262. {%- endblock -%}
  263. {#
  264. ###############################################################################
  265. # TODO: how to better handle JavaScript repr? #
  266. ###############################################################################
  267. #}
  268. {%- block data_javascript scoped %}
  269. {% set div_id = uuid4() %}
  270. <div id="{{ div_id }}" class="jp-RenderedJavaScript jp-OutputArea-output {{ extra_class }}" data-mime-type="application/javascript">
  271. {%- if not resources.should_sanitize_html %}
  272. <script type="text/javascript">
  273. var element = document.getElementById('{{ div_id }}');
  274. {{ output.data['application/javascript'] }}
  275. </script>
  276. {%- endif %}
  277. </div>
  278. {%- endblock -%}
  279. {%- block data_widget_view scoped %}
  280. {% set div_id = uuid4() %}
  281. {% set datatype_list = output.data | filter_data_type %}
  282. {% set datatype = datatype_list[0]%}
  283. <div id="{{ div_id }}" class="jupyter-widgets jp-OutputArea-output {{ extra_class }}">
  284. <script type="text/javascript">
  285. var element = document.getElementById('{{ div_id }}');
  286. </script>
  287. <script type="{{ datatype }}">
  288. {{ output.data[datatype] | json_dumps | escape_html_script }}
  289. </script>
  290. </div>
  291. {%- endblock data_widget_view -%}
  292. {%- block footer %}
  293. {% set mimetype = 'application/vnd.jupyter.widget-state+json'%}
  294. {% if mimetype in nb.metadata.get("widgets",{})%}
  295. <script type="{{ mimetype }}">
  296. {{ nb.metadata.widgets[mimetype] | json_dumps | escape_html_script }}
  297. </script>
  298. {% endif %}
  299. {{ super() }}
  300. {%- endblock footer-%}