{% extends "menu.html" %}

{% block css %}
{% load staticfiles %}

<link rel="stylesheet" type="text/css" href="{% static "css/bootstrap.css" %}">
<link rel="stylesheet" type="text/css" href="{% static "css/bootstrap-theme.min.css" %}">
<link rel="stylesheet" type="text/css" href="{% static "css/morris.css" %}">
<link rel="stylesheet" type="text/css" href="{% static "css/jquery.easy-pie-chart.css"%}">

<script src="{% static "js/jquery-1.9.1.min.js"%}"></script>
<script src="{% static "js/raphael-min.js"%}"></script>
<script src="{% static "js/morris.min.js"%}"></script>

{% endblock %}


{% block content %}

<div class="container theme-showcase" role="main">
	<div class="jumbotron">
    <div class="row">
        <div class="col-md-4">
				{% if project %}
						<h1>{{ project.title }} </h1>
						<p> {{ project.subtitle }}</p>
					{% endif %}

					{% if corpus %}
						<h2>{{ corpus.title }} </h2>
						<p>{{ corpus.subtitle }} </p>
						<p>{{ corpus.date }}, {{ corpus.language }}, {{ corpus.database }} ({{ number}} docs)</p>
					{% endif %}

					{% if number > 0 %}
						<a class="btn btn-primary btn-lg" role="button" href="/admin/documents/corpus/{{ corpus.pk }}/">Modify corpus</a>
						<a class="btn btn-default btn-lg" role="button" href="/admin/documents/corpus/{{ corpus.pk }}/">Export corpus</a></p>
					{% endif %}
			</div>

        <div class="col-md-7">
						<h2> Historic</h2>
						<div id="hero-area" style="height: 300px;"></div>
					{% if number == 0 %}
						<a class="btn btn-primary btn-lg" role="button" href="/admin/documents/corpus/{{ corpus.pk }}/">Add documents</a></p>
					{% endif %}
			</div>

			</div>
	</div>
</div>

<div class="container">
    <div class="row">
        <div class="col-md-4">
        <div class="jumbotron">
						<h3>Exploration</h3>
						<ol>
								<li>Feature</li>
								<li>Feature</li>
								<li>Feature</li>
						</ol>
				</div>
				</div>

				<div class="col-md-4">
        <div class="jumbotron">
						<h3>Catography</h3>
						<ol>
								<li>Feature</li>
								<li>Feature</li>
								<li>Feature</li>
						</ol>
        </div>
        </div>

				<div class="col-md-4">
        <div class="jumbotron">
						<h3>Dynamics</h3>
						<ol>
								<li>Feature</li>
								<li>Feature</li>
								<li>Feature</li>
						</ol>
        </div>
        </div>

    </div>

</div>



<script>
        // Morris Area Chart
        Morris.Area({
            element: 'hero-area',
            data: [
            {% if dates %}
            {% for d in dates %}
						{Period: '{{ d.to_char }}', Quantity: '{{ d.count }}', Infos: '10'},
            {% endfor %}
            {% endif %}
            ],
            xkey: 'Period',
            ykeys: ['Quantity', 'Infos'],
            labels: ['publications', 'Infos'],
            lineWidth: 2,
            hideHover: 'auto',
            lineColors: ["#939393",]
          });
</script>


<script>
        // Morris Donut Chart
        Morris.Donut({
            element: 'hero-donut',
            data: [
            {% if sources_donut %}
            {% for source in sources_donut %}
						{label: '{{ source.source }}, {{source.count}} docs', value: {{ source.part }} },
            {% endfor %}
            {% endif %}

            ],
            colors: ["#939393", "#939555"],
            //colors: ["#30a1ec", "#76bdee"],
            formatter: function (y) { return y + "%" }
        });
</script>

{% endblock %}