{% extends "browse.html" %}

{% comment %}
Copyright (C) 2017-2018  The Software Heritage developers
See the AUTHORS file at the top-level directory of this distribution
License: GNU Affero General Public License version 3, or any later version
See top-level LICENSE file for more information
{% endcomment %}

{% load static %}
{% load swh_templatetags %}
{% load render_bundle from webpack_loader %}

{% block header %}
{{ block.super }}
{% render_bundle 'origin' %}
{% endblock %}

{% block swh-browse-before-content %}
<div class="card">
  <div class="card-header bg-gray-light border-bottom-0">
    <div class="float-left">
        <a href="{% url 'browse-origin' origin_info.type origin_info.url %}" class="btn btn-default btn-sm" role="button">Latest snapshot</a>
    </div>
    {% if origin_info.url|slice:"0:4" == "http" %}
      <div class="float-right">
        <a href="{{ origin_info.url }}" class="btn btn-default btn-sm" role="button">Go to origin</a>
      </div>
    {% endif %}
    <h4 class="text-center">Origin: {{ origin_info.url }}</h4>
    <div class="clearfix"></div>
  </div>
</div>
{% endblock %}

{% block swh-browse-content %}
<div class="card-header bg-gray-light">
  <div class="float-left">
    <h4>{{ swh_object_name }}</h4>
  </div>
  <div class="clearfix"></div>
</div>

<div class="card-body">

  <h4>Overview</h4>

  <ul>
    <li>Total number of visits: <b>{{ origin_visits|length }}</b></li>
    <li>Last full visit: <span style="margin-left: 20px;" id="swh-last-full-visit"></span></li>
    <li>First full visit: <span style="margin-left: 20px;" id="swh-first-full-visit"></span></li>
    <li>Last visit: <span style="margin-left: 20px;" id="swh-last-visit"></span></li>
  </ul>

  <h4>History</h4>

  <div class="btn-group btn-group-toggle d-flex justify-content-center" data-toggle="buttons">
    <label class="btn btn-default btn-sm form-check-label active" onclick="swh.origin.showFullVisitsDifferentSnapshots(event)">
      <input type="radio" name="options" id="option1" autocomplete="off" checked> Show full visits with different snapshots
    </label>
    <label class="btn btn-default btn-sm form-check-label" onclick="swh.origin.showFullVisits(event)">
      <input type="radio" name="options" id="option2" autocomplete="off"> Show all full visits
    </label>
    <label class="btn btn-default btn-sm form-check-label" onclick="swh.origin.showAllVisits(event)">
      <input type="radio" name="options" id="option3" autocomplete="off"> Show all visits
    </label>
  </div>

  <h5>Timeline</h5>

  <div id="swh-visits-timeline" class="d3-wrapper"></div>

  <h5>Calendar</h5>

  <div id="swh-visits-calendar"></div>

  <h5>List</h5>

  <div id="swh-visits-list"></div>

</div>

<script>
  // all origin visits
  var visits = {{ origin_visits|jsonify }};
  swh.origin.initVisitsReporting(visits);
</script>
{% endblock %}