{% extends 'library/base.html' %}
{% load markdown_deux_tags %}
{% load formatting_filters %}

{% comment %}
# Copyright © 2016 SUSE LLC, James Mason <jmason@suse.com>.
#
# This file is part of openbare.
#
# openbare is free software: you can redistribute it and/or modify
# it under the terms of the GNU General Public License as published by
# the Free Software Foundation, either version 3 of the License, or
# (at your option) any later version.
#
# openbare is distributed in the hope that it will be useful,
# but WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
# GNU General Public License for more details.
#
# You should have received a copy of the GNU General Public License
# along with openbare. If not, see <http://www.gnu.org/licenses/>.
{% endcomment %}

{% block main %}
  <div class="jumbotron openbare-background">
    <h1>openbare</h1>
    <p>
      Public Cloud Demo Account Library
    </p>
    {% if not user or user.is_anonymous %}
    <p>
      {% for backend in backends.backends %}
        <a class="btn btn-success btn-lg" href="{% url 'social:begin' backend %}?next={{ request.path }}">Login via {{ backend }}</a>
      {% endfor %}
    </p>
    {% endif %}
  </div>

  {% if not user or user.is_anonymous %}
    <div class="row">
      <div class="col-md-12">
        <h2>Welcome!</h2>
        <dl>
          <dt>What is <i>openbare</i>?</dt>
          <dd>
            <i>openbare</i> is a digital asset library system. Digital assets,
            such as online accounts, e-books or software subscriptions can be
            made available for 'check out', similar to physical libraries.
          </dd>
          <dt>Who's providing this?</dt>
          <dd>
            This openbare instance is operated by
            <a href="{{ host.url }}" target="_blank">{{ host.name }}</a>.
            {% if host.payment_statement %}
              Any costs associated with the digital assets provided through this
              <i>openbare</i> instance are handled as follows:
              <blockquote>{{ host.payment_statement }}</blockquote>
            {% endif %}
          </dd>
          <dt>Is <i>openbare</i> open source?</dt>
          <dd>
            Yes! <i>openbare</i> is licensed under the GPLv3 license. You may
            view the source, file any bugs or enhancement requests, or
            help improve <i>openbare</i> through our github project:
            <a href="https://github.com/openbare/openbare">https://github.com/openbare/openbare</a>
          </dd>
        </dl>
      </div>
    </div>
  {% endif %}


  {% if user and not user.is_anonymous %}
    <div class="row">
      <div class="col-md-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">Library resources</h3>
          </div>
          <div class="panel-body">
            <table class="table table-hover">
              <thead>
                <tr>
                  <th>Resource</th>
                  <th>Available?</th>
                </tr>
              </thead>
              <tbody>
              {% for resource in resources %}
                <tr>
                  <td>
                    <button type="button" class="btn btn-link" data-toggle="modal" data-target="#resource_{{ resource.item_subtype }}_details">{{ resource.name }}</button>
                  </td>
                  <td>
                    {% if resource.is_available_for_user %}
                      <a href="{%url 'library:checkout' resource.item_subtype %}" role="button" class="btn btn-default btn-xs" title="Grant yourself access to this resource for a limited time." data-toggle="tooltip" >Checkout</a>
                    {% else %}
                      Due on {{ resource.next_available_date|format_date }}
                    {% endif %}
                  </td>
                </tr>
              {% endfor %}
              </tbody>
            </table>
          </div>
        </div>
      </div>

      <div class="col-md-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">Checked out to me</h3>
          </div>
          <div class="panel-body">
            <table class="table table-hover">
              <thead>
                <tr>
                  <th>Resource</th>
                  <th colspan=3>Due date</th>
                </tr>
              </thead>
              <tbody>
              {% for checked_out_item in user_items %}
                <tr>
                  <td>
                    <button type="button" class="btn btn-link" data-toggle="modal" data-target="#item_{{ checked_out_item.pk }}_details">{{ checked_out_item.name }}</button>
                  </td>
                  <td>
                    {{ checked_out_item.due_on|format_date }}
                  </td>
                  <td>
                    {% if checked_out_item.is_renewable %}
                      <a href="{%url 'library:renew' checked_out_item.pk %}" role="button" class="btn btn-default btn-xs" title="Need more time? Extend the due date." data-toggle="tooltip">Renew</a>
                    {% else %}
                      <span title="Need more time? Ask the site admins for an extension" data-toggle="tooltip"><button type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target="#item_{{ checked_out_item.pk }}_request_extension" >Request Extension</button></span>
                    {% endif %}
                  </td>
                  <td>
                    <a href="{%url 'library:checkin' checked_out_item.pk %}" role="button" class="btn btn-default btn-xs" title="Finished early? Return the resource so it's available to others." data-toggle="tooltip">Return</a>
                  </td>
                </tr>
              {% endfor %}
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>

    {% for resource in resources %}
      <div class="modal fade" id="resource_{{ resource.item_subtype }}_details" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="myModalLabel">{{ resource.name }}</h4>
            </div>
            <div class="modal-body">
              {{ resource.description|markdown }}
              <table class="table">
                <caption>{{ resource.checked_out_items.count }} of {{ resource.max_checked_out }} are checked out.</caption>
                <thead>
                  <tr>
                    <th>To</th>
                    <th>Due date</th>
                    <th>Renewable?</th>
                  </tr>
                </thead>
                <tbody>
                  {% for checked_out_item in resource.checked_out_items %}
                    <tr>
                      <td>
                        {{ checked_out_item.user }}
                      </td>
                      <td>
                        {{ checked_out_item.due_on }}
                      </td>
                      <td>
                        {% if checked_out_item.is_renewable %}
                          <i class="fa fa-check"></i>
                        {% endif %}
                      </td>
                    </tr>
                  {% endfor %}
                </tbody>
              </table>
            </div>
            <div class="modal-footer">
              {% if resource.is_available_for_user %}
                <a href="{%url 'library:checkout' resource.item_subtype %}" role="button" class="btn btn-default" data-placement="left" title="Grant yourself access to this resource for a limited time." data-toggle="tooltip">Checkout</a>
              {% else %}
                <button class="btn btn-disabled" data-toggle="tooltip" data-placement="left" title="Not available. Due back on {{ resource.next_available_date|format_date }}.">Checkout</button>
              {% endif %}
            </div>
          </div>
        </div>
      </div>
    {% endfor %}

    {% for checked_out_item in user_items %}
      <div class="modal fade" id="item_{{ checked_out_item.pk }}_request_extension" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <form action="{%url 'library:request_extension' checked_out_item.pk %}" method="POST">
              {% csrf_token %}
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">
                  {{ checked_out_item }} - request extension
                </h4>
              </div>
              <div class="modal-body">
                <p>
                  If you need to keep this resource beyond the due date, you may
                  request an extension from the Administrators.
                </p>
                <p>
                  Please explain your request here:
                </p>
                <textarea name="message" class="form-control" rows="5"></textarea>
              </div>
              <div class="modal-footer">
                <button type="submit" class="btn btn-primary" title="Email your request to the site admins" data-placement="left" data-toggle="tooltip">Send</button>
              </div>
            </form>
          </div>
        </div>
      </div>



      <div class="modal fade" id="item_{{ checked_out_item.pk }}_details" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="myModalLabel">
                {{ checked_out_item }}
              </h4>
            </div>
            <div class="modal-body">
              <dl>
                <dt>Checked out on:</dt>
                <dd>
                  {{ checked_out_item.checked_out_on|format_date }}
                </dd>
                <dt>Available renewals:</dt>
                <dd>
                  {{ checked_out_item.renewals }}
                </dd>
                <dt>Current due date:</dt>
                <dd>
                  {{ checked_out_item.due_on|format_date }}
                </dd>
              </dl>
            </div>
            <div class="modal-footer">
              {% if checked_out_item.is_renewable %}
                <a href="{%url 'library:renew' checked_out_item.pk %}" role="button" class="btn btn-default btn-xs" data-placement="left" title="Need more time? Extend the due date." data-toggle="tooltip">Renew</a>
              {% else %}
                <span title="Need more time? Ask the site admins for an extension" data-toggle="tooltip"><button type="button" class="btn btn-default btn-xs" data-dismiss="modal" data-toggle="modal" data-target="#item_{{ checked_out_item.pk }}_request_extension" >Request Extension</button></span>
              {% endif %}
              <a href="{%url 'library:checkin' checked_out_item.pk %}" role="button" class="btn btn-default btn-xs" data-placement="left" title="Finished early? Return the resource so it's available to others." data-toggle="tooltip">Return</a>
            </div>
          </div>
        </div>
      </div>
    {% endfor %}
    {% if checkout %}
      <div class="modal fade" id="checkout_credentials" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="myModalLabel">
                {{ checkout_title }}
              </h4>
            </div>
            <div class="modal-body">
              <p>
                Here are the credentials for accessing your instance:
              </p>
              <dl>
                {% for label, value in checkout_credentials.items %}
                  <dt>{{ label }}</dt>
                  <dd>
                    <code>{{ value }}</code>
                  </dd>
                {% endfor %}
              </dl>
              <p>
                Be sure to
                <a href="data:application/json;base64,{{ download_credentials_payload }}" target="_blank" download="{{ download_credentials_filename }}">
                  download
                </a>
                or otherwise record these before closing this dialog, they cannot be presented again.
                If you lose these credentials, you will have to return this item, and checkout the resource again.
              </p>
            </div>
            <div class="modal-footer">
              <a href="data:application/json;base64,{{ download_credentials_payload }}" target="_blank" download="{{ download_credentials_filename }}" role="button" class="btn btn-default">Download Credentials</a>
            </div>
          </div>
        </div>
      </div>
    {% endif %}
  {% endif %}
{% endblock %}

{% block js %}
  $('#checkout_credentials').modal('show');
{% endblock %}