| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <title>Mint</title> |
| <!-- Latest compiled and minified CSS --> |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> |
| <!-- NVD3 css --> |
| <link href="http://nvd3.org/assets/css/nv.d3.css" type="text/css" rel="stylesheet"/> |
| <!-- static sidebar --> |
| <link href="{{ url_for('static', filename='css/simple-sidebar.css') }}" type="text/css" rel="stylesheet"/> |
| </head> |
| <body> |
| <script src="http://nvd3.org/assets/lib/d3.v3.js"></script> |
| <script src="http://nvd3.org/assets/js/nv.d3.js"></script> |
| <!-- Simple Ajax content --> |
| <script> |
| function getCurrentTimeString() { |
| var now = new Date(); |
| return now.toLocaleString(); |
| } |
| function loadVisualization(content) { |
| var xmlhttp = new XMLHttpRequest(); |
| xmlhttp.onreadystatechange=function() { |
| if (xmlhttp.readyState==4 && xmlhttp.status==200) { |
| var response = JSON.parse(xmlhttp.responseText); |
| document.getElementById("visualization_" + content).innerHTML = |
| response['result']; |
| document.getElementById("visualization_" + content + "_time").innerHTML = |
| getCurrentTimeString(); |
| eval(response['script']); |
| } |
| } |
| document.getElementById("visualization_" + content).innerHTML = |
| "Loading..."; |
| xmlhttp.open("GET", "visualization/" + content, true); |
| xmlhttp.send(); |
| } |
| </script> |
| |
| <div id="wrapper"> |
| <!-- Sidebar --> |
| <div id="sidebar-wrapper"> |
| <ul class="sidebar-nav"> |
| <li class="sidebar-brand"> |
| <h3><span class="glyphicon glyphicon-leaf" aria-hidden="true"></span> Caffe-Mint</h3> |
| </li> |
| <li><a href="#page-content-wrapper"><strong>Top</strong></a></li> |
| {% for name in names %} |
| <li><a href="#visualization_{{name}}_panel"> {{name}} </a></li> |
| {% endfor %} |
| </ul> |
| </div> <!-- /#sidebar-wrapper --> |
| |
| <div id="page-content-wrapper"> |
| <p> |
| Visualizing folder: {{ root }}.<br/> |
| <a class="btn btn-default" id="menu-toggle">Toggle sidebar</a> |
| <a class="btn btn-default" id="menu-toggle" onclick="refreshAll()">Refresh all</a> |
| </p> |
| <div role="tabpanel"> |
| <!-- Nav tabs --> |
| <ul class="nav nav-tabs" role="tablist"> |
| <li role="presentation" class="active"><a href="#visualizations" aria-controls="visualizations" role="tab" data-toggle="tab">Visualizations</a></li> |
| <li role="presentation"><a href="#debug" aria-controls="debug" role="tab" data-toggle="tab">Debug</a></li> |
| </ul> |
| |
| <!-- Tab panes --> |
| <div class="tab-content"> |
| <p></p> |
| <div role="tabpanel" class="tab-pane active" id="visualizations"> |
| {% for name in names %} |
| <div class="panel panel-default" id="visualization_{{name}}_panel"> |
| <div class="panel-heading"> |
| {{ name }} |
| <a onclick="loadVisualization('{{name}}')"> |
| <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> |
| </a> |
| <a href="#page-content-wrapper" class="pull-right"> Top </a> |
| </div> |
| <div class="panel-body"> |
| <div id="visualization_{{name}}"> Loading... </div> |
| <p> Last updated: <span id="visualization_{{name}}_time">NA</span></p> |
| </div> |
| </div> |
| {% endfor %} |
| </div> |
| <div role="tabpanel" class="tab-pane" id="debug"> |
| <ul> |
| {% for message in debug_messages %} |
| <li>{{ message }}</li> |
| {% endfor %} |
| </ul> |
| </div> |
| </div> |
| </div> |
| |
| |
| <hr> |
| <div id="footer"> |
| <div class="container"> |
| <p> |
| Mint is a minimal Caffe2 visualization tool by |
| <a href="http://daggerfs.com/" target="_blank">Yangqing</a>. |
| </p> |
| </div> |
| </div> |
| </div> <!-- /#page-content-wrapper --> |
| </div><!-- /#wrapper --> |
| |
| <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> |
| <!-- Latest compiled and minified JavaScript --> |
| <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> |
| <!-- Menu Toggle Script --> |
| <script> |
| $("#menu-toggle").click(function(e) { |
| e.preventDefault(); |
| $("#wrapper").toggleClass("toggled"); |
| }); |
| </script> |
| <!-- load all contents for the first time when this page loads. --> |
| <script> |
| function refreshAll() { |
| {% for name in names %} |
| loadVisualization("{{name}}"); |
| {% endfor %} |
| } |
| refreshAll(); |
| </script> |
| </body> |
| </html> |
