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

{% load get_company_papers %}
{% load safe_cycle %}

{% block head_title %}
    {{ paper }}
{% endblock %}

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

{% block headstyle %}
    <link rel="stylesheet" href="{% static 'lib/fancybox/jquery.fancybox.css' %}"/>
{% endblock %}

{% block headscript %}
	<script type="text/javascript">
        $(document).ready(function(){
			$('#submit_save').click(function(){
				$('#id_next').val('save');
			});
        });
    </script>
{% 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><a href="{% url 'papers_home' %}">Papers</a></li>
        <li class="active">{{ paper.name }}</li>
    </ul>
    <h1>{{ paper.name }}</h1>

    {% if paper.subtitle %}
        <div class="row">
            <div class="col-lg-12">
                <h3 class="subtitle">{{ paper.subtitle }}</h3>
            </div>
        </div>
    {% endif %}

    <div id="paper_header">
        <div class="row">
            {% if paper.content_left %}
                <div class="col-lg-6">
                    {{ paper.content_left|safe }}
                </div>
            {% endif %}
            {% if paper.content_right %}
                <div class="col-lg-6">
                    {{ paper.content_right|safe }}
                </div>
            {% endif %}
        </div>

        {% if paper.pdf_file %}
			<div class="row">
	            <div class="col-lg-6">
	                <div class="btn btn-primary" style="margin-top: 20px;">
	                    <a href="{% url 'papers_paper_download' paper.slug %}" target="_blank">View the Learning Resource</a>
	                </div>
	            </div>
	        </div>
		{% endif %}

        {% if paper.external_url %}
			<div class="row">
	            <div class="col-lg-6">
	                <div class="btn btn-primary" style="margin-top: 20px;">
	                    <a href="{{ paper.external_url }}" target="_blank">View the Learning Resource</a>
	                </div>
	            </div>
	        </div>
		{% endif %}

		{% if paper.embed_code %}
			<div class="row">
	            <div class="col-lg-12">
	                <div class="btn btn-primary" style="margin-top: 20px;">
	                    <a id="paper_embed_link" data-toggle="collapse" data-target="#paper_embed">View the Learning Resource</a>
	                </div>
					<div id="paper_embed" class="collapse">
						{{ paper.embed_code|safe }}
					</div>
	            </div>
	        </div>
		{% endif %}


        {% if not paper_submission.complete %}
            <div class="row">
                <div class="col-lg-12">
                    <h2 class="evaluation_header">Evaluation</h2>
                </div>
            </div>
        {% endif %}
    </div>

{% endblock %}

{% block content %}

    <div id="paper">
        <div class="row">
            <div class="col-lg-12">
                <form action="" method="post" class="paper_evaluation">
                    {% csrf_token %}
                    {% if required_errors %}
                        <p class="text-danger">Please ensure that you complete all required fields before submitting the form</p>
                    {% endif %}

                    {% if paper_submission.complete %}
                        <div class="complete_paper">
                            <p>You have already completed this evaluation.</p>
                            <div class="btn button large_button"><a href="{% url 'papers_download_certificate' paper_submission.id %}" target="_blank">Download Certificate</a></div>
                        </div>
                    {% else %}
                        {% for section in paper_section %}
                            <div class="paper_section">
                                <h3>{{ forloop.counter }}. {{ section.name }}</h3>
                                {% for question in section.get_questions %}
                                    <div class="paper_question form-group {% if question in required_errors %}has-error{% endif %} {% cycle 'odd' 'even' %}">
                                        <div class="num">{% safe_cycle 'a' 'b' 'c' 'd' 'e' 'f' 'g' 'h' 'i' 'j' 'k' 'l' 'm' 'n' 'o' 'p' 'q' 'r' 's' 't' 'u' 'v' 'w' 'x' 'y' 'z' as letter %}</div>
                                        {% include "members/papers/partials/question.html" with question=question question_number=letter %}
                                    </div>
                                {% endfor %}
                            </div>
                        {% endfor %}

                        {% for question in paper_questions %}
                            <div class="paper_question form-group {% if question in required_errors or question in incorrect_questions %}has-error{% endif %} {% cycle 'odd' 'even' %}">
                                {% include "members/papers/partials/question.html" with question=question question_number=forloop.counter %}
                            </div>
                        {% endfor %}

                        <div class="form-group">
                            <div class="submit col-lg-12">
                                <input type="hidden" name="next" value="submit" id="id_next"/>
                                <input class="btn btn-secondary" type="submit" value="Save For Later" id="submit_save"/>
                                <input class="btn btn-primary" type="submit" value="Submit Answers" id="submit_complete"/>
                                <div class="clear"></div>
                            </div>
                        </div>
                    {% endif %}
                </form>
            </div>
        </div>

    </div>

{% endblock %}