
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Cloud Mesh for FutureGrid, OpenStack, Eucalyptus, Azure</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <strong><link rel="stylesheet" href="{{ url_for('static', filename='css/table.css') }}"></strong>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/datepicker.css') }}">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
      .sidebar-nav {
        padding: 9px 0;
      }
    </style>
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Placed at the top of the document so the certain onpage load functions work -->
    <script src="/static/js/jquery.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="/static/js/jeditable.js" type="text/javascript" charset="utf-8"></script>


    <!-- Fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png">
                    <link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png">
                                   <link rel="shortcut icon" href="ico/favicon.png">
  </head>

  <body>

    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container-fluid">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="/">
	    <img src="{{ url_for('static', filename='img/fg-logo-md-litejazz.png') }}" height="40" width=45"> Cloud Mesh</a>
          <div class="nav-collapse collapse">
            <p class="navbar-text pull-right">
              Logged in as <a href="#" class="navbar-link">Username</a>
            </p>
            <ul class="nav">
              <li class="{{ active.home }}"><a href="/">Home</a></li>
              <li class="{{ active.about }}"><a href="/about">About</a></li>
              <li class="{{ active.contact }}"><a href="/contact">Contact</a></li>
	      <li class="{{ active.profile }}"><a href="/profile">Profile</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>

    <div class="container-fluid">
      <div class="row-fluid">
        <div class="span3">
          <div class="well sidebar-nav">
            <ul class="nav nav-list">

              <li class="nav-header">Cloud Mesh</li>
              <li class="{{ active.home }}"><a href="/">Home</a></li>
              <li class="{{ active.table }}"> <a href="/table/">Table</a></li>
              <li class="{{ active.metric }}"> <a href="/metric/main">Metric</a></li>
	      <li class="{{ active.profile }}"><a href="/profile">Profile</a></li>
              <li class="nav-header">Pages</li>

                {% for page in pages %}

                  <li class="{{ active[page.path] }}">
                    <a href="{{ "/" + page.path }}">{{ page.title }}</a>
                  </li>

                {% else %}

                    <li>No Pages.</li>
                {% endfor %}

              <li class="nav-header">External Links</li>
              <li><a href="https://github.com/futuregrid/flask_cm">Code</a></li>
              <li><a href="http://cloudmesh.blogspot.com">Blog</a></li>
              <li><a href="https://portal.futuregrid.org">Future Grid</a></li>


            </ul>
          </div><!--/.well -->
        </div><!--/span-->

        <div class="span9">
	  <div class="container">
	    {% block content %}
	    {% endblock %}
	  </div>
        </div><!--/span-->
        <div class="span9">
{#
          <div class="hero-unit">
	    {% block contentbox %}
	    {% endblock %}
            <p><a class="btn btn-primary btn-large">Learn more &raquo;</a></p> 
          </div>
#}
          <div class="row-fluid">
            <div class="span4">
	      {% block contentsmall11 %}
	      {% endblock %}
{#              <p><a class="btn" href="#">View details &raquo;</a></p> #}
            </div><!--/span-->
            <div class="span4">
            <div class="span4">
	      {% block contentsmall12 %}
	      {% endblock %}
{#              <p><a class="btn" href="#">View details &raquo;</a></p> #}
            </div><!--/span-->
            <div class="span4">
	      {% block contentsmall13 %}
	      {% endblock %}
{#              <p><a class="btn" href="#">View details &raquo;</a></p> #}
            </div><!--/span-->
          </div><!--/row-->
          <div class="row-fluid">
            <div class="span4">
	      {% block contentsmall21 %}
	      {% endblock %}
{#              <p><a class="btn" href="#">View details &raquo;</a></p> #}
            </div><!--/span-->
            <div class="span4">
	      {% block contentsmall22 %}
	      {% endblock %}
{#              <p><a class="btn" href="#">View details &raquo;</a></p> #}
            </div><!--/span-->
            <div class="span4">
	      {% block contentsmall23 %}
	      {% endblock %}
{#              <p><a class="btn" href="#">View details &raquo;</a></p> #}
            </div><!--/span-->
          </div><!--/row-->
        </div><!--/span-->
      </div><!--/row-->
    </div><!--/.fluid-container-->

    <footer>
      <hr>
      <p align="right">&copy; Cloud Mesh {{ version }}, FutuerGrid, Indiana University, 
                Gregor von Laszewski, laszewski@gmail.com, 2013</p>
    </footer>
    <!-- javascript
    ================================================== -->
    
    
    <!--
    missing js are not loaded - @hroelee 03/07/2013
    <script src="/static/js/bootstrap-transition.js"></script>
    <script src="/static/js/bootstrap-alert.js"></script>
    <script src="/static/js/bootstrap-modal.js"></script>
    <script src="/static/js/bootstrap-dropdown.js"></script>
    <script src="/static/js/bootstrap-scrollspy.js"></script>
    <script src="/static/js/bootstrap-tab.js"></script>
    <script src="/static/js/bootstrap-tooltip.js"></script>
    <script src="/static/js/bootstrap-popover.js"></script>
    <script src="/static/js/bootstrap-button.js"></script>
    <script src="/static/js/bootstrap-collapse.js"></script>
    <script src="/static/js/bootstrap-carousel.js"></script>
    <script src="/static/js/bootstrap-typeahead.js"></script>
    -->
    <script src="/static/js/bootstrap-datepicker.js"></script>

  </body>
</html>
