{% extends '@RxConnexion/Admin/content.html.twig' %}
{% block content %}
    <div class="row max-width-initial">
        <div class="small-12 columns">
            <div id="flash-messages-content-page"></div>
            <div class="content-container">
                <div class="content-container-content">
                    <form action="" method="GET">
                        <div class="row max-width-initial" id="calendar-filter-container">
                            <div class="large-12 columns">
                                <div class="large-4 columns">
                                    <div class="input-group">
                                        <div class="row">
                                            <label class="input-group-label">Branch</label>
                                            <select required name="filter[branch]" class="input-group-field">
                                                <option value=""></option>
                                                {% for healthFacility in healthFacilities %}
                                                    <option {{ filter and filter.branch == healthFacility.id ? 'selected' : '' }}
                                                            value="{{ healthFacility.id }}">{{ healthFacility.description }}</option>
                                                {% endfor %}
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="large-4 columns">
                                    <div class="input-group">
                                        <div class="row">
                                            <label class="input-group-label">Clinician</label>
                                            <input required name="filter[provider_name]" type="text"
                                                   class="input-group-field"
                                                   value="{{ filter ? filter.provider_name : '' }}"/>
                                            <input name="filter[provider]" type="hidden"
                                                   value="{{ filter ? filter.provider : '' }}"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="large-3 columns">
                                    <div class="input-group">
                                        <div class="row">
                                            <label class="input-group-label">Date</label>
                                            <input required name="filter[date]" type="text"
                                                   class="date input-group-field"
                                                   value="{{ (filter ? filter.date : 'now')|date('m/d/Y') }}"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="large-1 columns button-container no-padding-right">
                                    <button type="submit" class="button just-continue"><i class="fa fa-refresh"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                    <div id="calendar-container">
                        <table id="calendar-datalist" width="100%">
                            <thead>
                            <tr>
                                <th class="">Time</th>
                                {% for weekDate in range(dateFrom|date('U'), dateTo|date('U'), 86400 ) %}
                                    <th class="">
                                        {{ weekDate|date('l') }}
                                        <br>
                                        {{ weekDate|date('m/d/Y') }}
                                    </th>
                                {% endfor %}
                            </tr>
                            </thead>
                            <tbody>
                            {% for key,time in times %}
                                <tr>
                                    <td class="time">{{ time.text }}</td>

                                    {% set isOut = provider.workSchedules.out is defined and time.text in provider.workSchedules.out %}

                                    {% for weekDate in range(dateFrom|date('U'), dateTo|date('U'), 86400 ) %}
                                        {% for schedule in schedules if schedule.scheduleDate == weekDate|date('m/d/Y') and (schedule.startTime_int == time.int or (schedule.startTime_int < time.int and (time.inc == schedule.endTime_int))) %}
                                            {% if isOut %}
                                                {% set bgColor = '#a0a0a0' %}
                                            {#{% elseif schedule.scheduleStatus in ['No Show','Cancelled','Rescheduled'] %}
                                                {% set bgColor = '#cacaca' %}#}
                                            {% elseif schedule.color is not empty %}
                                                {% set bgColor = '#' ~ schedule.color %}
                                            {% endif %}
                                            <td data-date.text="{{ weekDate|date('m/d/Y') }}"
                                                data-date.u="{{ weekDate }}"
                                                data-time.text="{{ time.text }}"
                                                data-time.int="{{ time.int }}"
                                                data-time.inc="{{ ( time.inc ) }}"
                                                data-provider="{{ provider.id }}"
                                                data-id="{{ schedule.id }}"
                                                data-start_time="{{ schedule.startTime }}"
                                                data-start_time.int="{{ schedule.startTime_int }}"
                                                data-end_time="{{ schedule.endTime }}"
                                                data-end_time.int="{{ schedule.endTime_int }}"
                                                data-action='u'
                                                data-status="{{ schedule.scheduleStatus }}"
                                                data-action="u"
                                                style="background-color: {{ bgColor }}"
                                                class="td-schedule"
                                            >
                                                {% set bgColor = '#34FF2E' %}
                                                <a href="{{ path('patient_detail', {'patient_id': schedule.patient_id|base64Encode}) }}"
                                                   target="_blank" style="color:#000;"><u>{{ schedule.patient }}</u></a>
                                                <br/>({{ schedule.chartType }})
                                                <br/>{{ schedule.scheduleStatus != 'Completed' ? schedule.scheduleStatus : schedule.chartStatus }}
                                            </td>
                                        {% else %}
                                            <td data-date.text="{{ weekDate|date('m/d/Y') }}"
                                                data-date.u="{{ weekDate }}"
                                                data-time.text="{{ time.text }}"
                                                data-time.int="{{ time.int }}"
                                                data-time.inc="{{ ( time.inc ) }}"
                                                data-action="n"
                                                data-id="0"
                                                class="td-schedule"></td>
                                        {% endfor %}
                                    {% endfor %}
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="reveal large" id="modal" data-reveal>
        <div id="modal-content"></div>
        <button class="close-button" data-close aria-label="Close modal" type="button">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>
    {% include '@RxConnexion/Admin/js.html.twig' %}
    <script language="javascript">
        //<![CDATA[

        calendar_week.urls.account_user_autocomplete_url = '{{ path('provider_autocomplete_for_schedule') }}';
        calendar_week.urls.schedule_formUrl = '{{ path('schedule_calendar_week_form') }}';
        calendar_week.urls.patient_autocomplete_url = '{{ path('patient_autocomplete') }}';
        calendar_week.urls.chartType_autocomplete_url = '{{ path('chart_type_autocomplete') }}';
        calendar_week.urls.provider_autocomplete_url = '{{ path('for_patient_schedule_provider_autocomplete') }}';
        calendar_week.urls.health_facility_autocomplete_url = '{{ path('health_facility_autocomplete') }}';
        calendar_week.urls.note_template_autocomplete_url = '{{ path('note_template_autocomplete') }}';
        calendar_week.urls.patientChartCheck_healthFacility_url = '{{ path('patient_chart_health_facility_check') }}';
        calendar_week.urls.note_template_data_url = '{{ path('note_template_data') }}';
        calendar_week.urls.calendar_formActionUrl = '{{ path('calendar_form_save') }}';

        calendar_week.settings.noteTemplateAccess = '{{ noteTemplateAccess }}';
        calendar_week.table = jQ('#calendar-datalist');
        jQ(document).ready(calendar_week.init);

        //]]>
    </script>

    {#<script src="https://maps.googleapis.com/maps/api/js?key={{ googleMapApiKey }}&libraries=places&callback=calendar_week.initMap" async defer></script>#}
{% endblock %}