{% extends 'base.html' %}
{% load i18n %}

{% block title %} - Content API{% endblock %}

{% block content %}

{% with ch_icon="icon-exchange" ch_title="Content API" ch_bc1="Content API" %}
{% include "layout_elements/category_header.html" %}
{% endwith %}

</div>

<div class="row">

<div class="span6">
  
  <div class="section">
    <div class="info_box">
      <div class="info_box_content ib_text">
        Developers can access the content of this website through a public API
        delivering JSON feeds for various object types of this website like 
        events, participants or documents. 
      </div>
    </div>
  </div>
  
  {% with sh_title="API Access" sh_icon="" sh_url_title="" %}
    {% include "layout_elements/section_header.html" %}
  {% endwith %} 

  <div class="section">
    <div class="info_box">
      <div class="info_box_content">
        <p>
          The API content can be accessed by using an API endpoint and adding 
          <code>?format=json</code> as a parameter, e.g.:
        </p>
        <pre>/api/v0.1/events/?format=json</pre>
      </div>
    </div>
  </div>
  
  {% with sh_title="Accessing Single Objects" sh_icon="" sh_url_title="" %}
    {% include "layout_elements/section_header.html" %}
  {% endwith %} 

  <div class="section">
    <div class="info_box">
      <div class="info_box_content">
        <p>
          Single objects can be accessed like this:
        </p>
        <pre>/api/v0.1/events/{id}/?format=json</pre>
        <pre>/api/v0.1/events/set/{id};{id}/?format=json</pre>
      </div>
    </div>
  </div>
  
</div>

<div class="span6">
  <div class="alert alert-info">Current version of the API: <b>v0.1</b></div>
  
  {% with sh_title="Entry Points" sh_icon="" sh_url_title="" %}
    {% include "layout_elements/section_header.html" %}
  {% endwith %}
  <table id="entry_points" class="table table-striped table-bordered"></table>
  
<script>
  $(document).ready(function() {
    $.getJSON('/api/v0.1/?format=json', function(data) {
      $.each(data, function(key, val) {
        var html = '';
        $.each(val, function(key2, val2) {
          html += '<tr><td><b>' + key + '</b></td>';
          html += '<td>' + key2 + '</td>';
          html += '<td>' + val2 + '</td>';
          html += '<td><a href="' + val2 + '?format=json">JSON</a></td></tr>';
        });
        $(html).appendTo($('#entry_points'));
      });
    });
  });
  
  
</script>
  
  
</div>

{% endblock %}