|
@@ -0,0 +1,123 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <title>{{ title }}</title>
|
|
|
+ <meta charset="utf-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=2">
|
|
|
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
|
|
|
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
|
|
|
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
|
|
+
|
|
|
+ <script src="https://tttt.fangmeier.tech/hl/shCore.js" type="text/javascript"></script>
|
|
|
+ <script src="https://tttt.fangmeier.tech/hl/shBrushPython.js" type="text/javascript"></script>
|
|
|
+ <link href="https://tttt.fangmeier.tech/hl/shCore.css" rel="stylesheet" type="text/css" />
|
|
|
+ <link href="https://tttt.fangmeier.tech/hl/shThemeDefault.css" rel="stylesheet" type="text/css" />
|
|
|
+ <script src="https://tttt.fangmeier.tech/hl/shAutoloader.js" type="text/javascript"></script>
|
|
|
+
|
|
|
+<script type="text/x-mathjax-config">
|
|
|
+MathJax.Hub.Config({
|
|
|
+ config: ["MMLorHTML.js"],
|
|
|
+ jax: ["input/TeX", "output/HTML-CSS", "output/NativeMML"],
|
|
|
+ extensions: ["MathMenu.js", "MathZoom.js"]
|
|
|
+});
|
|
|
+</script>
|
|
|
+<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS_HTML-full"> </script>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+<div class="container-fluid">
|
|
|
+{% for r, plot_row in enumerate(plots) %}
|
|
|
+ <div class="row">
|
|
|
+ {% for c, plot in enumerate(plot_row) %}
|
|
|
+ <div class="col-md-4">
|
|
|
+ <div class="well">
|
|
|
+ {% if plot.title %}
|
|
|
+ <h3 class="text-center">{{ plot.title }}</h3>
|
|
|
+ {% endif %}
|
|
|
+ <div>
|
|
|
+ <a href="#" title="{{ plot.name }}">
|
|
|
+ <img src="data:img/png;base64,{{ plot.data }}" style="width:100%" class="thumbnail img-responsive">
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="caption">
|
|
|
+ <p class="text-center"> {{ plot.name }} </p>
|
|
|
+ <div class="panel-group" id="accordion">
|
|
|
+ {% for id, (i,j) in enumerate(plot.docs.keys()) %}
|
|
|
+ <div class="panel-heading">
|
|
|
+ <h4 class="panel-title">
|
|
|
+ <button data-toggle="collapse" data-parent="#accordion" class="btn btn-info" href="#collapse{{r}}-{{c}}-{{id}}">
|
|
|
+ Plot at ({{i+1}}, {{j+1}})</button>
|
|
|
+ </h4>
|
|
|
+ </div>
|
|
|
+ <div id="collapse{{r}}-{{c}}-{{id}}" class="panel-collapse collapse">
|
|
|
+ <div class="panel-body">
|
|
|
+ {% for doc, argdict in zip(plot.docs[(i,j)], plot.argdicts[(i,j)]) %}
|
|
|
+ <p class="text-left">{{ doc|safe }}</p>
|
|
|
+ <hr>
|
|
|
+ <p class="text-left"><strong>Plot Arguments</strong></p>
|
|
|
+ <table class="table table-hover">
|
|
|
+ <tbody>
|
|
|
+ {% for key, val in argdict.items() %}
|
|
|
+ <tr>
|
|
|
+ <td>{{ key }}</td> <td>{{ val }}</td>
|
|
|
+ </tr>
|
|
|
+ {% endfor %}
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ {% endfor %}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ {% endfor %}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ {% endfor %}
|
|
|
+ </div>
|
|
|
+{% endfor %}
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-12-lg">
|
|
|
+ <div class="panel-group" id="accordion">
|
|
|
+ <div class="panel-heading">
|
|
|
+ <h4 class="panel-title" style="text-align:center">
|
|
|
+ <button data-toggle="collapse" data-parent="#accordion" class="btn btn-default" href="#collapseSrc">Figure Source Code</button>
|
|
|
+ </h4>
|
|
|
+ </div>
|
|
|
+ <div id="collapseSrc" class="panel-collapse collapse">
|
|
|
+ <div class="panel-body">
|
|
|
+<script type="syntaxhighlighter" class="brush: python"><![CDATA[ {{ source|safe}} ]]></script>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+<div id="myModal" class="modal fade" tabindex="-1" role="dialog">
|
|
|
+ <div class="modal-dialog modal-lg">
|
|
|
+ <div class="modal-content">
|
|
|
+ <div class="modal-header">
|
|
|
+ <button type="button" class="close" data-dismiss="modal">×</button>
|
|
|
+ <h3 class="modal-title">Heading</h3>
|
|
|
+ </div>
|
|
|
+ <div class="modal-body">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+</body>
|
|
|
+<style>
|
|
|
+.modal-dialog {width:900px;}
|
|
|
+.thumbnail {margin-bottom:6px;}
|
|
|
+.modal-title {text-align:center;}
|
|
|
+</style>
|
|
|
+<script>
|
|
|
+$('.thumbnail').click(function(){
|
|
|
+ $('.modal-body').empty();
|
|
|
+ var title = $(this).parent('a').attr("title");
|
|
|
+ $('.modal-title').html(title);
|
|
|
+ $($(this).parents('div').html()).appendTo('.modal-body');
|
|
|
+ $('#myModal').modal({show:true});
|
|
|
+});
|
|
|
+SyntaxHighlighter.all()
|
|
|
+</script>
|
|
|
+</html>
|