{% extends 'MainBundle:Master:template_head.html.twig' %}

{% block scripts %}

    <link rel="stylesheet" href="{{ asset('bundles/receive/css/receive.css') }}"/>
    {#Bootstrap#}

    {#<link type="text/css" href="{{ asset('bundles/utilities/timepicker/css/bootstrap.min.css') }}"/>#}
    {#<script type="text/javascript" src="{{ asset('bundles/utilities/js/jquery.timepicker.js') }}"></script>
    <link type="text/css" href="{{ asset('bundles/utilities/css/bootstrap-datepicker.css') }}"/>#}
    <link type="text/css" href="{{ asset('bundles/indicator/css/bootstrap-select.css') }}"/>
    <link rel="stylesheet" href="{{ asset('bundles/main/css/bootstrap.css') }}"/>
    {#<script type="text/javascript" src="{{ asset('bundles/utilities/timepicker/js/bootstrap.min.js') }}"></script>#}
    <script type="text/javascript" src="{{ asset('bundles/utilities/jquery-timepicker/jquery.ui.timepicker.js') }}"></script>    
    <script type="text/javascript" src="{{ asset('bundles/shedule/js/blockUI.js') }}"></script>
    <script type="text/javascript">
        var select_rooms = "{{ 'schedule.select_rooms'|trans([], 'LocalizationBundle') }}";
        var UrlDataLock = '{{ path("shedule_load_locks") }}';
        var UrlSaveLock = '{{ path("shedule_save_locks_range") }}';
        var UrlSearchLocks= '{{ path("search_locks") }}';
        var UrlVerifyLock= '{{ path("VerifyLocksRangeData") }}';
        var select_days = "{{ 'schedule.select_days'|trans([], 'LocalizationBundle') }}";
        var msjSaveOk = "{{ 'schedule.save_msj'|trans([], 'LocalizationBundle') }}";
        var msjSaveOk = "{{ 'schedule.save_msj'|trans([], 'LocalizationBundle') }}";
        var titleCreateNewSchedule = "{{ 'schedule.create_new_schedule'|trans([], 'LocalizationBundle') }}";
        var UrlSearchSpaceSchedule = '{{ path("schedule_appointment_SearchSpaceSchedule") }}';
        var diaFestivo='{{ 'room.dayHoliday'|trans([], 'LocalizationBundle') }}';
        var diaBloqueado='{{ 'room.dayblocked'|trans([], 'LocalizationBundle') }}';
        var date_error='{{ 'schedule.date_error'|trans([], 'LocalizationBundle') }}';
        var hour_init_error='{{ 'schedule.hour_init_error'|trans([], 'LocalizationBundle') }}';
        var hour_end_error='{{ 'schedule.hour_end_error'|trans([], 'LocalizationBundle') }}';
        var reasons_error='{{ 'schedule.reasons_error'|trans([], 'LocalizationBundle') }}';
        var urlRemove="{{ path('RemoveLocksSpace') }}";
        var deleteDa="{{ 'schedule.delete'|trans([], 'LocalizationBundle') }}";
        var deleteDaError="{{ 'schedule.remove_error'|trans([], 'LocalizationBundle') }}";
        var deleteDaSus="{{ 'schedule.remove_msj'|trans([], 'LocalizationBundle') }}";
        var cit = "{{ cit }}";
        var SrcGif = '{{ asset('bundles/utilities/images/anim_gif.gif') }}';
        var table='  <label for="style"  class="control-label"> <strong>'+
                "{{ 'schedule.modalities'|trans([], 'LocalizationBundle') }}"+
                '</strong></label> <table class="table" ><tr><td>'+
                '<label for="style"  class="control-label"><strong>'+
                "{{ 'schedule.date_init'|trans([], 'LocalizationBundle') }}"+
                '</strong></label></td><td>'+
                '<label for="style"  class="control-label"><strong>'+
                "{{ 'schedule.date_end'|trans([], 'LocalizationBundle') }}"+
                '</strong></label></td><td>'+
                '<label for="style"  class="control-label"><strong>'+
                "{{ 'schedule.days'|trans([], 'LocalizationBundle') }}"+
                '</strong></label></td><td><label for="style"  class="control-label"><strong>'+
                "{{ 'schedule.locks_reasons'|trans([], 'LocalizationBundle') }}"+
                '</strong></label></td><td><label for="style"  class=" control-label"><strong>'+
                "{{ 'schedule.hour_init'|trans([], 'LocalizationBundle') }}"+
                '</strong></label></td><td><label for="style"  class=" control-label"><strong>'+
                "{{ 'schedule.hour_end'|trans([], 'LocalizationBundle') }}"+
                '</strong></label></td><td><label for="style"  class=" control-label"><strong>X'+
                '</strong></label></td></tr>';
    </script>
    <script type="text/javascript" src="{{ asset('bundles/indicator/js/bootstrap-select.js') }}"></script>
    {#<script type="text/javascript" src="{{ asset('bundles/utilities/timepicker/js/bootstrap-timepicker.js') }}"></script>#}
    <script type="text/javascript" src="{{ asset('bundles/shedule/js/create_locks_range.js') }}"></script>

    <style>
        .ui-timepicker-inline { display: inline; }

        #ui-timepicker-div { padding: 0.2em; }
        .ui-timepicker-table { display: inline-table; width: 0; }
        .ui-timepicker-table table { margin:0.15em 0 0 0; border-collapse: collapse; }

        .ui-timepicker-hours, .ui-timepicker-minutes { padding: 0.2em;  }

        .ui-timepicker-table .ui-timepicker-title { line-height: 1.8em; text-align: center; }
        .ui-timepicker-table td { padding: 0.1em; width: 2.2em; }
        .ui-timepicker-table th.periods { padding: 0.1em; width: 2.2em; }

        /* span for disabled cells */
        .ui-timepicker-table td span {
            display:block;
            padding:0.2em 0.3em 0.2em 0.5em;
            width: 1.2em;

            text-align:right;
            text-decoration:none;
        }
        /* anchors for clickable cells */
        .ui-timepicker-table td a {
            display:block;
            padding:0.2em 0.3em 0.2em 0.5em;
            cursor: pointer;
            text-align:right;
            text-decoration:none;
        }


        /* buttons and button pane styling */
        .ui-timepicker .ui-timepicker-buttonpane {
            background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0;
        }
        .ui-timepicker .ui-timepicker-buttonpane button { margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
        /* The close button */
        .ui-timepicker .ui-timepicker-close { float: right }

        /* the now button */
        .ui-timepicker .ui-timepicker-now { float: left; }

        /* the deselect button */
        .ui-timepicker .ui-timepicker-deselect { float: left; }


    </style>
    
    <link rel="stylesheet" href="{{ asset('bundles/shedule/css/build.css') }}"/>
    <link href="{{ asset('bundles/utilities/css/font-awesome.css') }}" rel="stylesheet">
{% endblock %}
{% block content %}
    <section>
        <article>
            <div id="accordion1">
                <h3>{{ 'schedule.create_locks'|trans([], 'LocalizationBundle') }}</h3>

                <div style="padding-bottom: 100px;">
                    <div class="col-md-8" style="margin-bottom:30px;">
                        <div>

                            {# Modalities#}
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="style"
                                           class="col-sm-6 control-label">{{ 'schedule.locks_reasons'|trans([], 'LocalizationBundle') }}
                                        : (*)</label>

                                    <div class="col-sm-6">
                                        <select id="reasons" class="form-control select_receive">
                                            <option value="">{{ 'schedule.select_reasons'|trans([], 'LocalizationBundle') }}</option>
                                            {% for mt in motive %}
                                                <option value="{{ mt.id }}">{{ mt.name }}</option>
                                            {% endfor %}
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-12">
                            </div>
                            {#Date start#}
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="style"
                                           class="col-sm-6 control-label">{{ 'schedule.date_init'|trans([], 'LocalizationBundle') }}
                                        : (*)</label>

                                    <div class="col-sm-6">
                                        <input name="date_init" id="date_init" class="form-control field_receive"
                                               type="calendar">
                                    </div>
                                </div>
                            </div>
                            {#Fin Date start#}

                            {#Date end#}
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="style"
                                           class="col-sm-6 control-label">{{ 'schedule.date_end'|trans([], 'LocalizationBundle') }}
                                        : (*)</label>

                                    <div class="col-sm-6">
                                        <input name="date_end" id="date_end" class="form-control field_receive"
                                               type="calendar">
                                    </div>
                                </div>
                            </div>
                            {#Fin Date start#}

                            {# users#}
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="style"
                                           class="col-sm-6 control-label">{{ 'schedule.hour_init'|trans([], 'LocalizationBundle') }}
                                        : (*)</label>

                                    <div class="col-sm-6">
                                        <input name="hour_init" id="hour_init" class="form-control field_receive">
                                    </div>
                                </div>
                            </div>
                            {# users#}
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="style"
                                           class="col-sm-6 control-label">{{ 'schedule.hour_end'|trans([], 'LocalizationBundle') }}
                                        : (*)</label>

                                    <div class="col-sm-6">
                                        <input name="hour_end" id="hour_end" class="form-control field_receive">
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="style" id="dayBLabel" class="col-sm-3 control-label">{{ 'schedule.days'|trans([], 'LocalizationBundle') }} : (*)</label>
                                    <div class="col-md-9"> 
                                        {% for sch2 in schedule %}
                                            {% for schDD in sch2.daysWeek %}
                                                <div class="checkbox checkbox-primary checkbox-inline">
                                                    <input class="dayBlock" type="checkbox" id="{{ schDD }}" value="{{ schDD }}" >
                                                    <label for="{{ schDD }}"> {{ schDD }}</label>
                                                </div>
                                            {% endfor %}
                                        {% endfor %}
                                   </div>
                                   <input type="hidden" name="dayB" id="dayB" >
                                </div>
                            </div>

                            {#save#}
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="button" id="updateDataPatient" class="btn btn-primary" value="{{ 'room.saveLocks'|trans([], 'LocalizationBundle') }}">

                                    <input type="button" id="specialLock" class="btn btn-danger" value="{{ 'room.saveSpecialLock'|trans([], 'LocalizationBundle') }}" data-toggle="tooltip" title="El bloqueo especial permite a un usuario administrador asignar citas en horarios bloqueados para otros usuarios " >
                                </div>
                            </div>
                            <div class="col-md-12">
                                <hr>
                            </div>
                            {#Fin save #}
                        </div>
                        <div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <div id="loader" align="center">
                                        <img src="{{ asset('bundles/main/images/ajax-loader.gif') }}"/>
                                    </div>
                                    <div id="tableLocks">
                                        {% if(eventLock  is iterable) %}

                                            <label for="style"  class="control-label">
                                                <strong>{{ 'room.locksGrid'|trans([], 'LocalizationBundle') }}</strong>
                                            </label>
                                            <table class="table" >
                                                <tr>
                                                    <td>
                                                        <label for="style"  class="control-label">
                                                            <strong>{{ 'schedule.date_init'|trans([], 'LocalizationBundle') }}</strong>
                                                        </label>
                                                    </td>
                                                    <td>
                                                        <label for="style"  class="control-label">
                                                            <strong>{{ 'schedule.date_end'|trans([], 'LocalizationBundle') }}</strong>
                                                        </label>
                                                    </td>
                                                    <td>
                                                        <label for="style"  class="control-label">
                                                            <strong>días</strong>
                                                        </label>
                                                    </td>
                                                    <td>
                                                        <label for="style"  class="control-label">
                                                            <strong>{{ 'schedule.locks_reasons'|trans([], 'LocalizationBundle') }}</strong>
                                                        </label>
                                                    </td>
                                                    <td>
                                                        <label for="style"  class=" control-label">
                                                            <strong>{{ 'schedule.hour_init'|trans([], 'LocalizationBundle') }}</strong>
                                                        </label>
                                                    </td>
                                                    <td>
                                                        <label for="style"  class=" control-label">
                                                            <strong>{{ 'schedule.hour_end'|trans([], 'LocalizationBundle') }}</strong>
                                                        </label>
                                                    </td>
                                                    <td>X
                                                    </td>
                                                </tr>
                                                    {% for EvL in eventLock %}
                                                        <tr>
                                                            <td>{{ EvL.dateInit }}</td>
                                                            <td>{{ EvL.dateEnd }}</td>
                                                            <td>
                                                                {% for dia in EvL.days %}
                                                                    {{ dia }},
                                                                {% endfor %}                                                            
                                                            </td>
                                                            <td>{{ EvL.name }}</td>
                                                            <td>{{ EvL.hourInit }}</td>
                                                            <td>{{ EvL.hourEnd }}</td>
                                                            <td><a href="#" class="dataLock"  name="{{ EvL.idBlocked }}"
                                                                   style="white-space:normal !important;text-align: center;"
                                                                   title="{{ 'schedule.delete'|trans([], 'LocalizationBundle') }}">
                                                                    <span class="ui-icon ui-icon-trash"></span></a>
                                                            </td>
                                                        </tr>
                                                    {% endfor %}


                                            </table>

                                        {% else %}

                                            <label for="style"  class="control-label">
                                                <strong>{{ eventLock }}</strong>
                                            </label>
                                        {% endif %}
                                    </div>



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

                    </div>
                    <div class="col-md-4" style="margin:20px 0 0 0">
                        {% for sch in schedule %}
                            <div id="hid">
                                <input type="hidden" id="dateinitD" value="{{ sch.dateStart }}">
                                <input type="hidden" id="dateendD" value="{{ sch.dateEnd }}">
                                <input type="hidden" id="hourinitD" value="{{ sch.hoursStartD }}">
                                <input type="hidden" id="hourendD" value="{{ sch.hoursEndD }}">
                                <input type="hidden" id="roomD" value="{{ sch.roomCode }}">
                            </div>
                            {# Nombre #}

                            <div class="clearfix" >
                                <label for="style"><strong style="text-transform: uppercase;">{{ 'schedule.title_data'|trans([], 'LocalizationBundle') }}</strong>:</label>
                                <hr>
                            </div>

                            {# Nombre #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.name'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="nombre" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="Name"> {{ sch.name }}</label>
                            <div class="clearfix"></div>
                            {# Fecha inicial #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.date_init'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="dateInit" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="Date init"> {{ sch.dateStart }}</label>
                            <div class="clearfix"></div>
                            {# Fecha final #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.date_end'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="dateEnd" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="Date end"> {{ sch.dateEnd }}</label>
                            <div class="clearfix"></div>
                            {# Hora inicial #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.hour_init'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="hoursInit" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="Hours init"> {{ sch.hoursStart }}</label>
                            <div class="clearfix"></div>
                            {# Hora final #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.hour_end'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="hoursEnd" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="Hours end"> {{ sch.hoursEnd }}</label>
                            <div class="clearfix"></div>
                            {# Días #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.days'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="days" class="col-sm-9" name="style" type="text" list="stylelist" title="Days">
                                {% for schD in sch.daysWeek %}
                                    {{ schD }},
                                {% endfor %}
                            </label>

                            <div class="clearfix"></div>
                            {# Salas #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.rooms'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="room" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="Rooms"> {{ sch.roomName }}</label>
                            <div class="clearfix"></div>
                            {# Salas #}
                            <label class="col-sm-3"
                                   for="style"><strong>{{ 'schedule.duration'|trans([], 'LocalizationBundle') }}</strong>:</label>
                            <label id="duration" class="col-sm-9" name="style" type="text" list="stylelist"
                                   title="duration"> {{ sch.duration }}</label>
                            <input type="hidden" value="{{ sch.duration }}" id="durationData"/>
                            <div class="clearfix"></div>
                        {% endfor %}
                    </div>

                </div>
            </div>
        </article>
    </section>
    {# Div modal alerts#}
    <div id="alertError">
        <div class="alert alert-success" id="alertSuccess" role="alert"></div>
        <div class="alert alert-danger" id="alertDanger" role="alert"></div>
    </div>

{% endblock %}