{% extends "base.html" %}

{% block title %}Wikidata Query Service report{% endblock %}

{% block content %}
<div class="p-2">

  <div class="container">
    <div class="row">
      <div class="col">
        <h1>{{ self.title() }}</h1>

        <p>This report lists every query sent to the <a href="https://query.wikidata.org/">Wikidata Query Service</a> (WQDS) by WADE. Failed queries are in red.</p>
      </div>
    </div>

    <div class="row">
      <div class="col-2">when</div>
      <div class="col-4">page</div>
      <div class="col-1">time</div>
      <div class="col-2">template</div>
      <div class="col">options</div>
    </div>
  {% for obj in q %}
    {% if obj.status_code and obj.status_code != 200 %}{% set class=" text-light bg-danger"%}{% endif %}
    <div class="row">
      <div class="col-2{{ class }}">
        {{ obj.start_time.strftime('%Y %b %d %H:%M') }}
      </div>
      <div class="col-4"><a href="{{ obj.path }}">{{ obj.path }}</a></div>

      <div class="col-1{{ class }}">
        {% if obj.end_time %}
          {{ obj.display_seconds }}&nbsp;secs
        {% else %}
          running
        {% endif %}
      </div>

      <div class="col-2{{ class }}">
        {{ obj.template or '' }}
      </div>

      <div class="col">
        <a href="#" class="toggle" data-id="{{ obj.id }}">show/hide</a> |
        <a href="https://query.wikidata.org/#{{ obj.sparql_query | urlencode }}">run</a>
      </div>
      </div>

      <div id="query_{{ obj.id }}" class="row sparql">
        <div class="col">
          <pre>{{ obj.sparql_query }}</pre>
        </div>
      </div>

      <div class="row error">
        <div class="col">
        {% if obj.status_code != 200 %}
          <div>status code: {{ obj.status_code }}</div>
          <pre>{{ obj.error_text }}</pre>
        {% endif %}
        </div>
      </div>
  {% endfor %}
  </div>

</div>

{% endblock %}

{% block script %}
<script>
  $('.sparql').hide();
  $('.error').hide();

  $('.toggle').click(function() {
    var query_id = $(this).data('id');

    $('#query_' + query_id).toggle();
  });

</script>
{% endblock %}