@extends('layout.sidebar')
@section('content')

<h3>Asistencia de Actividades Extracurriculares</h3>
@if($groupActivities)
<br/>
{{ Form::open(array('url' => 'extracurricularActivity/extracurricular-activities-attendance')) }}
{{ Form::hidden('reportAttendance', action('ExtracurricularActivityController@getAttendanceExcelReport', array()), array('id'=>'reportAttendance')) }}
    <div class="row">
        <div class="col-md-3">
            {{ Form::label('extracurricular_act','Actividad Extracurricular:') }}
        </div>
        <div class="col-md-3">
            <select id="extracurricular_act" name="extracurricular_act" class="form-control">
                @if($isAdmin)
                 <option value="ALL" start_date="" end_date="" daysDisabled="6,0">
                        TODOS
                    </option>
                @endif
                @foreach($groupActivities as $activity)
                    @if($activity->extracurricularActivity->status == 'ACTIVE')
                                        <option value="{{ $activity->id }}" start_date="{{ $activity->start_date }}" end_date="{{ $activity->end_date }}" daysDisabled="{{ $daysDisabled }}">
                        {{ $activity->extracurricularActivity->name . ' - ' . $activity->extracurricularGroup->name }}
                    </option>
                    @endif
                @endforeach                
            </select>
        </div>
    </div>
    <br/>
    <div class="row">
        <div class="col-md-3">
            {{ Form::label('date','Fecha:') }}
        </div>
        <div class="col-md-3">
            <div class='input-group date datepicker'>
                {{ Form::text('date',null,array('class'=>'form-control')) }}
                <span class="input-group-addon">
                    <span class="glyphicon glyphicon-calendar"></span>
                </span>
            </div>
        </div>
    </div>
    <br/>
    <div id="btnReportContainer" class="row" style="display: none;">   
        {{ Form::button('Generar reporte', array('class' => 'btn btn-success', 'id' => 'btnReport')) }}
    </div>
    <div id="tableContainer"></div>
{{ Form::close() }}
@else
    <div class="alert alert-danger alert-dismissible" role="alert">
        <p>No existen actividades extracurriculares para este usuario</p>
    </div>
@endif
<script>
    $('#tableContainer').hide();
    $('.datepicker').datepicker({
        format: 'yyyy-mm-dd',
        language: 'es',
        orientation: 'top',
        autoclose: true
    });
    
    loadDates($('#extracurricular_act option:selected'));
    loadStudents($('#extracurricular_act option:selected').val());
    
    $('#extracurricular_act').change(function () {
        $('#date').val('');
        $('#tableContainer').hide();
        $("#btnReportContainer").hide();
        loadDates($('option:selected',this));
        loadStudents($('#extracurricular_act option:selected').val());
    });
    
    $('.datepicker').on('changeDate', function(date){
        $("#btnReportContainer").show();
        if($('#extracurricular_act option:selected').val() != "ALL"){
            loadAttendance($('#extracurricular_act option:selected').val(),date.format());
        }
    });
    
    function loadDates(element) {
        $('.datepicker').datepicker('setStartDate',element.attr('start_date'));
        $('.datepicker').datepicker('setEndDate',element.attr('end_date'));
        $('.datepicker').datepicker('setDaysOfWeekDisabled',element.attr('daysDisabled'));
    }    
    function loadStudents(activity_id) {
        $('.loading').show();
        $.ajax({
            url: 'students-for-attendance',
            data: {
                activity_id: activity_id
            },
            success:function(data) {
                $("#tableContainer").html(data);
                $('.loading').hide();
                $('.attendance').on('change',function(){
                    if($(this).val() == '0'){
                        $(this).closest('td').siblings('.comment').find('textarea').hide();
                    }else{
                        $(this).closest('td').siblings('.comment').find('textarea').show();
                    }
                });
            }
        });
    }
    function loadAttendance(activity_id, attendance_date) {
        $('.loading').show();
        $.ajax({
            url: 'attendance-info',
            dataType: "json",
            data: {
                activity_id: activity_id,
                attendance_date: attendance_date
            },
            success:function(data) {
                $('.table tbody tr').each(function(){
                    var self = $(this);
                    var registered_id = $(this).find('.registered').attr('registered_id');
                    var band = false;
                    self.find('.comment').find('textarea').show();
                    $.each(data,function(key,value){
                        if(value.registered_id == registered_id){
                            self.find('.attendance_type ').find('select').val(value.attendance_type);
                            self.find('.comment').find('textarea').text(value.comment);
                            band = true;
                        }
                    });
                    if(!band){
                        self.find('.attendance_type ').find('select').val("0");
                        self.find('.comment').find('textarea').text('');
                        self.find('.comment').find('textarea').hide();
                    }
                });
                $('#tableContainer').show();
                $('.loading').hide();
                
            }
        });
    }
    //Reporte
    $('#btnReport').click(function () {
        var date = $('#date').val() != '' ? $('#date').val() : 0;
        var id_group_activities = $('#extracurricular_act option:selected').val();        
        window.location = $('#reportAttendance').val() + '/' + date + '/' + id_group_activities;
    });
</script>
@stop()