{% extends "public/content.html" %}

{% block headscript %}
    <script type="text/javascript">
        $(document).ready(function(){
            $('.category_title').click(function(){

                var papers  = $(this).parent().find('.category_papers');

                if (papers.is(':visible')){
                    papers.slideUp();
                    $(this).find('.arrow').removeClass('glyphicon-upload');
                    $(this).find('.arrow').addClass('glyphicon-download');
                } else {
                    $('.category_papers').slideUp();
                    papers.slideDown();
                    $(this).find('.arrow').removeClass('glyphicon-download');
                    $(this).find('.arrow').addClass('glyphicon-upload');
                }
            });

            $('.paper').hover(function(){
               $(this).addClass('hover');
            },function(){
               $(this).removeClass('hover');
            });
        });
    </script>
{% endblock %}

{% block head_title %}
	Papers
{% endblock %}

{% block left_content %}
	{% include "members/partials/locker-tabs.html" with active_tab="papers" %}
{% endblock %}

{% block title %}

    <ul class="breadcrumb">
        <li><a href="/">Home</a></li>
        <li><a href="{% url 'account_home' %}">My {{ settings.WEBSITE_CODE }}</a></li>
        <li class="active">Papers</li>
    </ul>

    <h1>PSGBI CME System</h1>
{% endblock %}


{% block content %}

    <div id="papers">

        <div class="row">
            <div class="col-lg-12">
                <div class="categories">
                    {% for category in categories %}
    					{% if category.get_papers %}
                            <div class="category">
        	                    <div class="category_title">
                                    <h2>{{ category.name }}</h2>
                                    <span class="arrow glyphicon glyphicon-download"></span>
                                </div>
                                <div class="category_papers">
                                    {% for paper in category.get_papers %}
                                        <div class="paper {% cycle 'odd' 'even' %}">
                                            <h3><a href="{% url 'papers_paper' paper.slug %}">{{ paper }}</a></h3>
                                            {% if paper.subtitle %}<p>{{ paper.subtitle }}</p>{% endif %}
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        {% endif %}
                    {% endfor %}
                </div>
                {% if current_member.get_paper_submissions %}
                    <h2><a href="{% url 'papers_submissions' %}">View Submissions</a></h2>
                {% endif %}
            </div>
        </div>

    </div>


{% endblock %}