{% extends page.html %}

{% block title %}IPython Dashboard{% end %}

{% block stylesheet %}
    <link rel="stylesheet" href="{{static_url("css/projectdashboard.css") }}" type="text/css" />
    <link rel="stylesheet" href="{{static_url("css/alternateuploadform.css") }}" type="text/css" />
{% end %}


{% block params %}

data-project={{project}}
data-base-project-url={{base_project_url}}
data-base-kernel-url={{base_kernel_url}}
data-read-only={{read_only}}

{% end %}


{% block site %}

<div id="main_app">

<div id="tabs">
    <ul>
        <li><a href="#tab1">Notebooks</a></li>
        <li><a href="#tab2">Clusters</a></li>
        <li><a href="#tab3">Transient</a></li>
        <li><a href="#tab4">Show All</a></li>
    </ul>

    <div id="tab1">
        {% if logged_in or not read_only %}
        <div id="notebook_toolbar">
            <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>
            <span id="notebook_buttons">
                <button id="refresh_notebook_list" title="Refresh notebook list">Refresh</button>
            </span>
        </div>
        {% end %}

        <div id="notebook_list">
        </div>
    </div>
    <div id="tab2">

        <div id="cluster_toolbar">
            <span id="cluster_list_info">IPython parallel computing clusters</span>

            <span id="cluster_buttons">
                <button id="refresh_cluster_list" title="Refresh cluster list">Refresh</button>
            </span>
        </div>

        <div id="cluster_list">
            <div id="cluster_header">
                <span>profile</span>
                <span>action</span>
                <span title="Enter the number of engines to start or empty for default"># of engines</span>
                <span>status</span>
            </div>
        </div>

    </div>
    <div id="tab3">
        {% if logged_in or not read_only %}
        <div id="notebook_toolbar">
            <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>
        {% end %}

        <div id="transient-notebook_list">
        </div>
    </div>
    <div id="tab4">
        {% if logged_in or not read_only %}
        <div id="notebook_toolbar">
            <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>
        {% end %}

        <div id="showall-notebook_list">
        </div>
    </div>
</div>

</div>

{% end %}

{% block script %}
    <script src="{{static_url("js/notebooklist.js") }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{static_url("js/clusterlist.js") }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{static_url("js/projectdashboardmain.js") }}" type="text/javascript" charset="utf-8"></script>
{% end %}
