{# extends page #}
{% extends "base.html.twig" %}

{% block BeforeAnyCSSFile %}
    {% for file in encore_entry_css_files('select2__init') %}
        <link rel="stylesheet" href="{{ assetsBasePath~file }}">
    {% endfor %}
{% endblock %}

{% set pagename = 'Exam List' | trans %}

    {% set addBtnTitle = 'Schedule An Exam?' | trans %}
    {% set addBtnLink = path('exam_schedule') %}

    {% block showHeaderMenuButtons %}
        {% if is_granted('ROLE_EXAMINATION_MANAGER') %}
            <div id="kt_header_menu" class="kt-header-menu kt-header-menu-mobile  kt-header-menu--layout-default ">
                <ul class="kt-menu__nav ">
                    <li class="kt-menu__item  kt-menu__item--open kt-menu__item--here kt-menu__item--submenu kt-menu__item--rel kt-menu__item--open kt-menu__item--here kt-menu__item--active"
                        data-ktmenu-submenu-toggle="click" aria-haspopup="true"><a href="javascript:;"
                                                                                   class="kt-menu__link kt-menu__toggle"><span
                                    class="kt-menu__link-text">{{ 'Reports' | trans }}</span><i
                                    class="kt-menu__ver-arrow la la-angle-right"></i></a>
                        <div class="kt-menu__submenu kt-menu__submenu--classic kt-menu__submenu--left">
                            <ul class="kt-menu__subnav">
                                <li class="kt-menu__item " aria-haspopup="true"><a href="{{ path('exam_list') }}"
                                                                                   class="kt-menu__link "><i
                                                class="kt-menu__link-bullet kt-menu__link-bullet--dot"><span></span></i><span
                                                class="kt-menu__link-text">{{ 'Add new exams' | trans }}</span></a></li>

                                <li class="kt-menu__item " aria-haspopup="true"><a href="{{ path('exam_schedule') }}"
                                                                                   class="kt-menu__link "><i
                                                class="kt-menu__link-bullet kt-menu__link-bullet--dot"><span></span></i><span
                                                class="kt-menu__link-text">{{ 'Create new exam schedule' | trans }}</span></a>
                                </li>
                                <li class="kt-menu__item " aria-haspopup="true"><a
                                            href="{{ path('classBasedMarkReporting') }}"
                                            class="kt-menu__link "><i
                                                class="kt-menu__link-bullet kt-menu__link-bullet--dot"><span></span></i><span
                                                class="kt-menu__link-text">{{ 'Class Report' | trans }}</span></a></li>
                                <li class="kt-menu__item " aria-haspopup="true"><a
                                            href="{{ path('student_based_reporting') }}"
                                            class="kt-menu__link "><i
                                                class="kt-menu__link-bullet kt-menu__link-bullet--dot"><span></span></i><span
                                                class="kt-menu__link-text">{{ 'Student Evaluation' | trans }}</span></a>
                                </li>
                            </ul>
                        </div>
                    </li>
                </ul>
                <a href="{{ path('exam_list') }}"
                   class="p-2 m-auto btn btn-label-primary btn-bold">{{ 'Start New Exam?' }}</a>
            </div>
        {% endif %}

    {% endblock %}

{# main content of page display here#}
{% block MainContent %}

    {# Search block for the student list#}
    <div class="kt-portlet">

        {# Title footer #}
        <div class="kt-portlet__head" data-toggle="collapse" data-target="#demo">
            <div class="kt-portlet__head-label">
                {# Heading #}
                <h3 class="kt-portlet__head-title">{{ 'Filter Recrods'|trans }} &nbsp;</h3>
                {# dropdown #}
                <span class="hand-cursor">
                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px"
                     height="24px" viewBox="0 0 24 24" version="1.1" class="kt-svg-icon">
                    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                        <polygon id="Shape" points="0 0 24 0 24 24 0 24"></polygon>
                        <path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z"
                              id="Path-94" fill="#000000" fill-rule="nonzero"
                              transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999) "></path>
                    </g>
                </svg>
            </span>
            </div>
        </div>

        {# form where to write text.#}
        {# {{ app.request.query.get('csE') is empty ?  'collapse'  }} #}
        <span class="" id="demo">
            <form class="kt-form" method="get">
                    <div class="kt-portlet__body add___filter_place">
                        {#active class of active sessions - when class is selected then enrolled users are load accordingly#}
                        {% set ColsClass = 'col-lg-2 col-md-2 col-sm-4 col-xs-6' %}
                        {# filters #}
                        <div class="row">

                        {# list of all exams #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Exams'|trans }}</label>
                            <select class="form-control simpleSelect2" name="exams">
                                <option value="">{{ 'Select Exams' | trans }}</option>
                                {% for exam in exams %}
                                    <option  {{ app.request.query.get('exams')  == exam.id | urlencrypt ?  'selected="selected"' : '' }} value="{{ exam.id | urlencrypt }}">{{ exam.getExamName }}</option>
                                {% endfor %}
                            </select>
                        </div>

                        {#  list of all sessinos #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Sessions'|trans }}</label>
                            <select class="form-control simpleSelect2" name="session">
                                <option value="">{{ 'Select Session' | trans }}</option>
                                {% for se in sessions %}
                                    <option  {{ app.request.query.get('session')  == se.id | urlencrypt ?  'selected="selected"' : '' }} value="{{ se.id | urlencrypt }}">{{ se.name }}</option>
                                {% endfor %}
                            </select>
                        </div>

                        {# list of classes in sessions #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Classes'|trans }}</label>
                            <select class="form-control simpleSelect2" name="class">
                                <option value="">{{ 'Select Class' | trans }}</option>
                                {% for class in classes %}
                                    <option  {{ app.request.query.get('class')  == class.id | urlencrypt ?  'selected="selected"' : '' }} value="{{ class.id | urlencrypt }}">{{ class.session.name }} >> {{ class.name }}</option>
                                {% endfor %}
                            </select>
                        </div>

                        {# subjects list #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Subjects'|trans }}</label>
                            <select class="form-control simpleSelect2" name="subject">
                                <option value="">{{ 'Select Subject' | trans }}</option>
                                {% for subject in subjects %}
                                    <option  {{ app.request.query.get('subject')  == subject.id | urlencrypt ?  'selected="selected"' : '' }} value="{{ subject.id | urlencrypt }}"> {{ subject.getClasses.getname }} >>  {{ subject.getSubjectName }}</option>
                                {% endfor %}
                            </select>
                        </div>

                        {# date #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Exam Date'|trans }}</label>
                            <input type="text" name="examDate" class="form-control simpleDatePicker"
                                   value="{{ app.request.query.get('examDate') }}">
                        </div>

                        {# location #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Locations'|trans }}</label>
                            <select class="form-control simpleSelect2" name="location">
                                <option value="">{{ 'Select Examiner' | trans }}</option>
                                    {% for location in locations %}
                                        <option  {{ app.request.query.get('location')  == location['exam_location'] ?  'selected="selected"' : '' }} value="{{ location['exam_location'] }}">{{ location['exam_location'] }}</option>
                                    {% endfor %}
                            </select>
                        </div>

                        {# examiner #}
                        <div class="{{ ColsClass }}">
                            <label class="col-form-label">{{ 'Examiner'|trans }}</label>
                            <select class="form-control simpleSelect2" name="examiner">
                                <option value="">{{ 'Select Examiner' | trans }}</option>
                                {% for examiner in examiners %}
                                    <option  {{ app.request.query.get('examiner')  == examiner.id | urlencrypt ?  'selected="selected"' : '' }} value="{{ examiner.id | urlencrypt }}">{{ examiner.fullName }}</option>
                                {% endfor %}
                            </select>
                        </div>
                        </div>

                        {# Search & Reset Button  #}
                        <div class="row centerButton kt-margin-t-20">
                              <div style="text-align: center" class="col-md-12">
                                <button type="submit" class="btn btn-primary">{{ 'Search'|trans }}</button>
                                &nbsp;
                                <a target="_blank" class="btn btn-info"
                                   href="{{ path('exam_schedule_list', {'printResult' : 1,'exams' :app.request.query.get('exams'), 'session': app.request.query.get('session') , 'class' :  app.request.query.get('class'), 'subject': app.request.query.get('subject'), 'examDate' : app.request.query.get('examDate'), 'location': app.request.query.get('location'), 'examiner':app.request.query.get('examiner') }) }}">{{ 'Print' | trans }}</a>
                                &nbsp;
                                <button class="btn btn-danger clearSelect2"
                                        data-target="{{ path('exam_schedule_list') }}">{{ 'Clear'|trans }}</button>
                            </div>
                              </div>
                    </div>
            </form>
        </span>

    </div>

    {# List of the students #}
    <div class="kt-portlet">
        {# list of student #}
        <div class="kt-portlet__body">
            <div class="kt-section">
                <div class="kt-section__content">
                    <table class="table table-striped table-bordered">
                        <thead>
                        <tr>
                            <th>{{ 'Exam'|trans }}</th>
                            <th>{{ 'Class'|trans }}</th>
                            <th>{{ 'Subject'|trans }}</th>
                            <th>{{ 'Date'|trans }}</th>
                            <th>{{ 'Start time'|trans }}</th>
                            <th>{{ 'End Time'|trans }}</th>
                            <th>{{ 'Location'|trans }}</th>
                            <th>{{ 'Examiners'|trans }}</th>
                            <th>{{ '#'|trans }}</th>
                        </tr>
                        </thead>

                        <tbody>

                        {# Exam Schedule #}
                        {% for es in examSchedule %}
                            <tr>
                                {# Exam#}
                                <td>  {{ es.exam.examName is not empty  ? es.exam.examName }} </td>
                                {# Class #}
                                <td> {{ es.class.name is not empty ? es.class.session.name ~ ' >> '~ es.class.name }} </td>
                                {# Subjects #}
                                <td>{{ es.classSubject.subjectName is not empty ? es.classSubject.subjectName }} </td>
                                {# Date #}
                                <td> {{ date_format(es.ecDate) }} </td>
                                {# Start time #}
                                <td>{{ time_format(es.examStartTime) }}</td>
                                {# End time #}
                                <td> {{ time_format(es.examEndTime) }} </td>
                                {# location #}
                                <td> {{ es.examLocation }} </td>
                                {# examiners #}
                                <td>
                                    {% for exaimers in es.getExaminers.toArray %}
                                        {{ exaimers.getUser.getFullName }} <br>
                                    {% endfor %}
                                </td>

                                {% if is_granted('ROLE_EXAMINATION_MANAGER')  or is_granted('ROLE_TEACHER') %}
                                    {# actions #}
                                    <td>
                                        <a data-toggle="dropdown" class="btn btn-sm btn-clean btn-icon btn-icon-md"
                                           aria-expanded="false"><i class="fa fa-ellipsis-h"></i></a>
                                        <div class="dropdown-menu dropdown-menu-right dotedDropdown"
                                             x-placement="bottom-end">
                                            <ul class="kt-nav">

                                                {% if is_granted('ROLE_EXAMINATION_MANAGER') %}
                                                    {# edit exam schedule #}
                                                    <li class="kt-nav__item">
                                                        <a class="kt-nav__link"
                                                           href="{{ path('exam_schedule', {'id':es.id | urlencrypt  }) }}"><i
                                                                    class="kt-nav__link-icon flaticon-edit-1"></i><span
                                                                    class="kt-nav__link-text">{{ 'Edit'|trans }}</span></a>
                                                    </li>
                                                {% endif %}

                                                {# marks exam #}
                                                <li class="kt-nav__item">
                                                    <a class="kt-nav__link" target="_blank"
                                                       href="{{ path('marks__exam_sheet_enter_marks', {'ClassID':  es.class.id | urlencrypt , 'examClassID' : es.id |urlencrypt  }) }}"><i
                                                                class="kt-nav__link-icon flaticon-edit-1"></i><span
                                                                class="kt-nav__link-text">{{ 'Enter Marks'|trans }}</span></a>
                                                </li>

                                            </ul>
                                        </div>
                                    </td>
                                {% endif %}


                            </tr>
                        {% endfor %}
                        </tbody>

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

{% endblock %}

{% block ExtraJsFIles %}
    {% for file in encore_entry_js_files('exams') %}
        <script src="{{ assetsBasePath ~ file }}" type="text/javascript"></script>{% endfor %}
{% endblock %}

{% block documentation %}
    <h5><b>Exams Schedule List?</b></h5>
    <br/>
    <div class="mb-3 accordion accordion-solid accordion-toggle-plus" id="accordionExample1">
        <div class="card">
            <div class="card-header" id="flow_div">
                <div class="card-title" data-toggle="collapse" data-target="#collapse_flow_div" aria-expanded="false"
                     aria-controls="collapseOne1">
                    Q1. What is the Flow of Exam? (If you're new to Exams, Please make sure you followed
                    these Setups)
                </div>
            </div>
            <div id="collapse_flow_div" class="collapse" aria-labelledby="flow_div" data-parent="#accordionExample1"
                 style="">
                <div class="card-body">
                    A1. <a target="_blank"
                           href="{{ path('secure_file_server', {'filePath'  : secure('fekara/media/help/ExamFlow.png')}) }}">See
                        Fig, To Check Flow</a>
                    <ul>
                        <li>Step 1 is about to add {{ 'Exams'|trans }} <a href="{{ path('exam_list') }}">Complete Step
                                1</a></li>
                        <li>Step 2 is about to {{ 'Schedule An Exam'|trans }} <a target="_blank"
                                                                                 href="{{ path('exam_schedule') }}">Complete
                                Step 2</a></li>
                        <li>Step 3 is to Assign Teacher to <b>Scheduled Exam</b>Step 3 is completed in Step 2, you can
                            assign Teacher/Examiner to Scheduled Exam by selected Teacher from teacher Drop-down
                            <a href="{{ path('secure_file_server', {'filePath':secure('fekara/media/help/ExamScheduleAssignTeacher.png')}) }}"
                               target="_blank">See Fig</a>
                        </li>
                        <li>Step 4 is for <b> Exams Marking</b> (Assign number to Students), How to assign it?
                            <a target="_blank"
                               href="{{ path('secure_file_server', {'filePath': secure('fekara/media/help/enterMarks.png')}) }}">See
                                Fig</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <p><b>Exam Schedule</b>, shows the list of Scheduled Exams! </p>

    <h5><b>How to do Exam Marking or Assign Marks to Students for Exam?</b></h5>
    <p>At the very right side Column of Exam Schedule, shows the some action one of them is <b>Enter Marks of
            Students</b>, Click on it
        <a target="_blank"
           href="{{ path('secure_file_server', {'filePath': secure('fekara/media/help/enterMarks.png')}) }}">See Fig</a>
    </p>

{% endblock %}