{% extends "page.html" %}

{% block title %}{{page_title}}{% endblock %}


{% block stylesheet %}
{{super()}}
<link rel="stylesheet" href="{{ static_url("tree/css/override.css") }}" type="text/css" />
{% endblock %}

{% block params %}

data-project="{{project}}"
data-base-project-url="{{base_project_url}}"
data-notebook-path="{{notebook_path}}"
data-base-kernel-url="{{base_kernel_url}}"

{% endblock %}


{% block site %}

<div id="ipython-main-app" class="container">

<div id="tab_content" class="tabbable">
    <ul id="tabs" class="nav nav-tabs">
        <li class="active"><a href="#notebooks" data-toggle="tab">Notebooks</a></li>
        <li><a href="#clusters" data-toggle="tab">Clusters</a></li>
    </ul>

    <div class="tab-content">
    <div id="notebooks" class="tab-pane active">
        <div id="notebook_toolbar" class="row-fluid">
            <div class="span8">
                <form id='alternate_upload'  class='alternate_upload' >
                    <span id="drag_info" style="position:absolute" >
                        To import a notebook, drag the file onto the listing below or <strong>click here</strong>.
                        </span>
                    <input type="file" name="datafile" class="fileinput" multiple='multiple'>
                </form>
            </div>
            <div class="span4 clearfix">
                <span id="notebook_buttons" class="pull-right">
                    <button id="new_notebook" title="Create new notebook" class="btn btn-small">New Notebook</button>
                    <button id="refresh_notebook_list" title="Refresh notebook list" class="btn btn-small"><i class="icon-refresh"></i></button>
                </span>
            </div>
        </div>

        <div id="notebook_list">
          <div id="notebook_list_header" class="row-fluid list_header">
              <div id="project_name">
                <ul class="breadcrumb">
                    <li><a href="{{breadcrumbs[0][0]}}"><i class="icon-home"></i></a><span>/</span></li>
                    {% for crumb in breadcrumbs[1:] %}
                        <li><a href="{{crumb[0]}}">{{crumb[1]}}</a> <span>/</span></li>
                    {% endfor %}
                </ul>
              </div>
          </div>
        </div>
    </div>
    
    <div id="clusters" class="tab-pane">

        <div id="cluster_toolbar" class="row-fluid">
            <div class="span8">
                <span id="cluster_list_info">IPython parallel computing clusters</span>
            </div>
            <div class="span4" class="clearfix">
                <span id="cluster_buttons" class="pull-right">
                    <button id="refresh_cluster_list" title="Refresh cluster list" class="btn btn-small"><i class="icon-refresh"></i></button>
                </span>
            </div>
        </div>

        <div id="cluster_list">
            <div id="cluster_list_header" class="row-fluid list_header">
                <div class="profile_col span4">profile</div>
                <div class="status_col span3">status</div>
                <div class="engines_col span3" title="Enter the number of engines to start or empty for default"># of engines</div>
                <div class="action_col span2">action</div>
            </div>
        </div>
    </div>
</div>

</div>

{% endblock %}

{% block script %}
    {{super()}}
    <script src="{{ static_url("base/js/utils.js") }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{static_url("base/js/dialog.js") }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{static_url("tree/js/notebooklist.js") }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{static_url("tree/js/clusterlist.js") }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{static_url("tree/js/main.js") }}" type="text/javascript" charset="utf-8"></script>
{% endblock %}