#!/usr/bin/env python
# coding: utf-8

# # This is a Markdown Cell with some embedded [mermaid](https://github.com/knsv/mermaid)
# 
# > Wait for the embedded mermaid...
# 
# <div class="mermaid">
#     graph LR
#         A[Square Rect] -- Link text --> B((Circle))
#         A --> C(Round Rect)
#         B --> D{Rhombus}
#         C --> D
# </div>
# 
# > That was great!

# # This is another markdown cell.
# 
# > It has two mersmaid.
# 
# <div class="mermaid">graph TB
#     subgraph one
#         a1-->a2
#     end
#     subgraph two
#         b1-->b2
#     end
#     subgraph three
#         c1-->c2
#     end
#     c1-->a2
# </div>
# 
# ### Here's some markdown between them!
# 
# <div class="mermaid">sequenceDiagram
#     participant Alice
#     participant Bob
#     Alice->>John: Hello John, how are you?
#     loop Healthcheck
#         John->>John: Fight against hypochondria
#     end
#     Note right of John: Rational thoughts <br/>prevail...
#     John-->>Alice: Great!
#     John->>Bob: How about you?
#     Bob-->>John: Jolly good!
# </div>

# > The below must be included somewhere, but the end is fine!

# In[70]:


get_ipython().run_cell_magic('html', '', '<script src="//cdn.rawgit.com/bollwyvl/53e64cdafba38461943b/raw/0815758d591dfaf0f4918b388aed1bf11d82160d/mermaid.full.js"></script>\n<style>\n    .mermaid *{font-family: sans-serif; }\n    .mermaid .node, .mermaid .cluster{\n      fill: white !important;\n      stroke: black !important;\n      stroke-width: 1px !important;\n    }\n    .mermaid div{\n      text-align: center;\n    }\n    .mermaid .label{\n      color: black;\n    }\n</style>\n<script>$(function(){\n    // mermaid load a touch weirdly: try immediately, but try again later if it\'s not available\n    var initMermaid = function(){\n        return (window.mermaid && mermaid.init()) || setTimeout(initMermaid, 50);         \n    }\n    initMermaid();\n\n    // for live editing, re-render only the text of the current cell\n    window.IPython && $(IPython.events).on("rendered.MarkdownCell", function(evt, data){\n        // this is using a hacked mermaid that accepts some nodes!\n        mermaid.init(undefined, data.cell.element.find(".mermaid"));\n    });\n});</script>\n')