{% set layout = "ClarolineCoreBundle:Workspace:layout.html.twig" %}

{% if isDesktop() %}
    {% set layout = "ClarolineCoreBundle:Desktop:layout.html.twig" %}
{% endif %}

{% extends layout %}

{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('bundles/ujmexo/css/tableLayout.css') }}" type="text/css" rel="stylesheet"/>
{% endblock %}

{% block title %} {{ 'list of question' | trans }} {% endblock %}

{% block resourceBreadcrumb %}
    <li><a href="{{ path('claro_resource_open', { 'resourceType': _resource.resourceNode.resourceType.name(), 'node': _resource.resourceNode.id }) }}">{{ _resource.getResourceNode().getName() }}</a></li>
    <li><a href="{{ path('ujm_exercise_questions', {'id': exoID}) }}">{{ 'my questions' | trans }}</a></li>
    <li class="active">{{ 'list of question' | trans }}</li>
{% endblock %}

{% set exerciseID = exoID %}

{% block section_content %}
    <div class="panel-heading">
        <h3 class="panel-title">{{ 'list of question' | trans }}</h3>
    </div>
    <div class="panel-body">
        <a class="btn btn-primary" href="{{ path('ujm_exercise_questions', { 'id':  exoID }) }}">
            <i class="fa fa-arrow-left"></i> {{ 'back' | trans }}
        </a>
        <a class="btn btn-primary" href="{{ path('ujm_question_new', { 'exoID': exoID }) }}">
            <i class="fa fa-plus"></i> {{ 'create a new entry' | trans }}
        </a>
        <a class="btn btn-primary" title="{{ 'qti format warning' | trans }}" onClick="importQTI('{{ path('ujm_qti_import_form') }}', '{{ exoID }}');">
            <i class="fa fa-download"></i> {{ 'import QTI' | trans }}
        </a>
        <a class="btn btn-primary" href="{{ path('ujm_question_search_question', { 'exoID': exoID }) }}">
            <i class="fa fa-question"></i> {{ 'searchQuestion' | trans }}
        </a>
        <a class="btn btn-primary" href="#" onclick="importQuestion('{{ path('ujm_exercise_validate_import') }}',
            {{ exoID }}, {{ pageToGo }}, '{{ 'nothingToImport' | trans }}');event.preventDefault();">
                <i class="fa fa-arrow-circle-o-down"></i> {{ 'import' | trans }}
        </a>
        {% if QuestionsExo == 'false' %}
            {% if (pagerMy.getNbResults > pagerMy.maxPerPage or pagerShared.getNbResults > pagerShared.maxPerPage) and displayAll == 0 %}
                <a class="btn btn-primary" href="{{ path('ujm_exercise_import_question', { 'exoID': exoID, 'displayAll': 1 }) }} ">
                    <i class="fa fa-plus-circle"></i> {{ 'display all on this page' | trans }}
                </a>
            {% elseif displayAll == 1 %}
                <a class="btn btn-primary" href="{{ path('ujm_exercise_import_question', { 'exoID': exoID }) }}">
                    <i class="fa fa-minus-circle"></i> {{ 'display pagination' | trans }}
                </a>
            {% endif %}
        {% endif %}

        <select id="exoList" onchange="getQuestionsExoImport(this.options[this.selectedIndex].value,
                     '{{ path('ujm_exercise_import_question', { 'exoID': exoID, 'idExo': idExo, 'QuestionsExo': 'true' }) }}',
                     '{{ path('ujm_exercise_import_question', { 'exoID': exoID }) }}');">
            {% include "UJMExoBundle:Partial:listToFilterQuestions.html.twig" %}
        </select>

        <form action="{{ path('ujm_question_briefSearch') }}" method="post" id='formBriefSearch'>
            <div class="input-group" style="width: 350px; margin-top: 20px;">
                <input type="text" class="form-control" id="briefSearch" placeholder="{{ 'briefSearch'|trans }}" name="userSearch"
                    onkeydown="if (event.keyCode == 13) {
                        briefSearchSubmit();
                        return false; }">
                <input type='hidden' name='exoID' value={{ exoID }} />
                <input type='hidden' name='where' value='import' />
                <span class="input-group-btn">
                    <button class="btn btn-default" type="button" id="SubmitBriefSearch"
                        onClick="briefSearchSubmit();">
                    <i class="fa fa-search"></i></button>
                    <a class="btn btn-default" data-toggle="tooltip" title="Recherche par type"
                       accesskey=""href="#" onclick="showInfos();event.preventDefault();">
                        <i class="fa fa-question"></i>
                    </a>
                </span>
            </div>
        </form>

        <div id="infosSearch" style="display: none;">
            <br/>
            <div class="alert alert-info">
                <p>
                    {{ 'infoSearchType' | trans }} :
                    <ul>
                        <li style="list-style-type: circle">'qcm' {{ 'forTypeOf' | trans }} {{ 'InteractionQCM' | trans }},</li>
                        <li style="list-style-type: circle">'graphic' {{ 'forTypeOf' | trans }} {{ 'InteractionGraphic' | trans }},</li>
                        <li style="list-style-type: circle">'hole' {{ 'forTypeOf' | trans }} {{ 'InteractionHole' | trans }},</li>
                        <li style="list-style-type: circle">'open' {{ 'forTypeOf' | trans }} {{ 'InteractionOpen' | trans }}.</li>
                        <li style="list-style-type: circle">'matching' {{ 'forTypeOf' | trans }} {{ 'InteractionMatching' | trans }}.</li>
                    </ul>
                </p>
            </div>
        </div>
    </div>
    {% if qtiError is defined %}
        <div class="alert alert-warning">{{ qtiError }}</div>
    {% endif %}
    <div class="list-group">
        <div class="list-group-item">
            {% if QuestionsExo == 'false' %}
                <h3 class="panel-title">{{ "my questions"|trans }} : </h3><br/>
                {% if interactions is not empty %}
                    {% set questionsList = 'importMy' %}
                    {% include "UJMExoBundle:Partial:question/questionsList.html.twig" %}

                    <div>
                        {% if pagerMy.haveToPaginate %}
                            <div class="text-center panel-footer">
                                {{ pagerfanta(pagerMy, 'twitter_bootstrap_translated',
                                    {'routeName': 'ujm_exercise_import_question', 'routeParams':
                                    { 'exoID': exoID, 'pagerShared': pagerShared.getCurrentPage,
                                        'pagerMy': pagerMy.getCurrentPage, 'click': 'my', 'pageGoNow': pageToGo } }) }}
                            </div>
                        {% endif %}
                    </div>
                {% else %}
                    <div class="alert alert-info">{{ 'noQuestionFound'|trans }} ...</div>
                {% endif %}
                <hr/>
                <h3 class="panel-title">{{ 'my shared questions' | trans }} : </h3><br/>
                {% if sharedWithMe is not empty %}
                    {% set questionsList = 'importShare' %}
                    {% set interactions = sharedWithMe %}
                    {% include "UJMExoBundle:Partial:question/questionsList.html.twig" %}

                    <div>
                        {% if pagerShared.haveToPaginate %}
                            <div class="text-center panel-footer">
                                {{ pagerfanta(pagerShared, 'twitter_bootstrap_translated',
                                    {'routeName': 'ujm_exercise_import_question', 'routeParams':
                                    { 'exoID': exoID, 'pagerMy': pagerMy.getCurrentPage,
                                        'pagerShared': pagerShared.getCurrentPage,  'click': 'shared',
                                        'pageGoNow': pageToGo} }) }}
                            </div>
                        {% endif %}
                    </div>
                {% else %}
                    <div class="alert alert-info">{{ 'noQuestionFound'|trans }} ...</div>
                {% endif %}
            {% else %}
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title">{{ 'exercice linked Question' | trans }}</h3>
                    </div>
                    <div class="panel-body">
                        {% if interactions is not empty %}
                            {% set questionsList = 'importExoList' %}
                            {% include "UJMExoBundle:Partial:question/questionsList.html.twig" %}
                        {% else %}
                            <div class="alert alert-info">{{ 'noQuestionFound'|trans }} ...</div>
                        {% endif %}
                    </div>
                </div>
            {% endif %}
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript" src="{{ asset('bundles/ujmexo/js/sortAndSearch.js') }}"></script>
    <script type="text/javascript" src="{{ asset('bundles/ujmexo/js/resize.js') }}"></script>
    <script type="text/javascript" src="{{ asset('bundles/ujmexo/js/exerciseImportQuestion.js') }}"></script>
    <script type="text/javascript" src="{{ asset('bundles/ujmexo/js/qti.js') }}"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            ready();
        });
        $("#exoList option[value=\""+{{ idExo }}+"\"]").attr('selected', 'selected');
    </script>
{% endblock %}