gedankenstuecke/jupyter-gallery

{% extends 'main/base.html' %}
{% block content %}
{% load static %}
    <h1>Your Notebooks & Account</h1>
    <p class="lead">
    </br>See which notebooks you have shared and can share.
    </p>
    <div class="row">
      <div class="col-md-4">
        <p>
          {%if notebook_files%}
          <h4>Notebooks you can share</h4>
          <div class="table-responsive">
          <table class='table'>
            <thead>
              <tr>
                <th>Notebook title</th>
              </tr>
            </thead>
            <tbody>
            {% for nb_file in notebook_files%}
            <tr>
              <td>
              <code>{{nb_file.basename}}</code> <a href="{% url 'add-notebook-gallery' nb_file.id%}"><button type="button" class="btn btn-default btn-xs">add/replace <i class="far fa-plus-square"></i></button></a>
              </td>
            </tr>
            {%endfor%}
          </tbody>
        </table>
        </div>
        {%else%}
        You haven't shared any notebooks yet! <b>Head to the <a href="/about">About</a> page</b> to learn how to share your own notebooks!
        {%endif%}
        </p>
      </div>
      <div class="col-md-8">
        <p>
          <h4>Notebooks you have already published in the gallery</h4>
        </p>
        {% if existing_notebooks %}
        <div class="table-responsive">
        <table class='table'>
          <thead>
            <tr>
              <th>Notebook title</th>
              <th></th>
              <th></th>
              <th></th>
              <th></th>
            </tr>
          </thead>
          <tbody>
          {%for notebook in existing_notebooks%}
            <tr>
              <td><a href="{%url 'notebook-details' notebook.id%}"><code>{{notebook.notebook_name}}</code><i class="fas fa-info-circle"></i>
            </a></td>
              <td><a href="{% url 'edit-notebook' notebook.id%}"><button type="button" class="btn btn-default btn-xs">edit description <i class="far fa-edit"></i></button></a></td>
              <td>
                <form action="{% url 'delete-notebook' notebook.id %}" method="post">
                  {% csrf_token %}
                  <button type="submit" value="delete_notebook" class="btn btn-default btn-xs">delete <i class="far fa-trash-alt"></i></button>
                </form>
              </td>
              <td><a href="#previewModal" data-nbid="{{notebook.id}}" data-nbtitle="{{notebook.notebook_name}}"data-toggle="modal"><button type="button" class="btn btn-default btn-xs">preview <i class="fas fa-camera-retro"></i></button></a></td>
              <td><a href='{% url 'open-notebook' notebook.id %}'><button type="button" class="btn btn-default btn-xs">open as notebook <i class="fas fa-external-link-alt"></i></button></a></td>
            </tr>
          {%endfor%}
          </tbody>
        </table>
        </div>
        {%else%}

          No data available yet.

        {%endif%}
        <form action="{% url 'delete-user' %}" method="post">
          {% csrf_token %}
          <button type="submit" value="delete" class="btn btn-danger">Delete account & all notebooks <i class="far fa-trash-alt"></i></button>
        </form>
      </div>
    </div>

    <!-- Trigger the modal with a button -->

<!-- Modal -->
<div id="previewModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title"><i><div id='nbtitle_fill'></div></i></code></h4>
      </div>
      <div class="modal-body">
        <div id='notebook_filler'></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
{% endblock %}