@extends('layouts.master')

@section('css')
{!! Html::style('css/jquery_ui.css')!!}

<style type="text/css">
    th {
        text-align: center;
    }
    td {
        vertical-align: middle !important;
    }
</style>
@stop

@section('content')   
    @if(count($grupos)==0)
    <br>
        <div class="alert alert-warning" role="alert">No se han encontrado <strong>grupos</strong> disponibles
        </div>
    @else
    @if(Auth::guard('administrador')->check())
    <div class="form-group col-lg-6 col-md-6 col-sm-12 col-xs-12">
        <label for="buscar">Buscar</label>
        {!! Form::text('buscar',NULL, $attributes =  array('class' => 'form-control','id'=>'buscar','placeholder'=>'Insertar código o descripción de la asignatura'))!!}
    </div>
    @endif
    <div class="clearfix"></div>
        <br>
        <div class="table-responsive">
           <table class="table table-hover table-bordered" width="100%">
                <thead>
                    <tr class="info">
                        <th>C&oacute;digo</th>
                        <th>Asignatura</th>
                        <th>Secci&oacute;n</th>                           
                        <th>Localidad</th>                           
                        <th>Inscritos</th>
                        <th colspan="3">Opciones</th>
                    </tr>                   
                </thead>
                <tbody id="materias">
                @foreach($grupos as $grupo)                                                 
                    <tr class="text-center">
                        <td>{!! $grupo->materia_id !!}</td>
                        <td>{!! $grupo->materia !!}</td>
                        <td>{!! $grupo->seccion !!}</td>
                        <td>{!! $grupo->localidad !!}</td>
                        <td>{!! $grupo->inscritos !!}</td>                            
                        {!! $grupo->botones!!}                         
                    </tr>
                @endforeach
                </tbody>
            </table> 
        </div>        
    @endif    
    
@stop
@section('postscript')
<!-- Incluyo Javascript de la libreria Datatable -->
{!! Html::script('js/jquery_ui.js') !!}
<script type="text/javascript">
    @if(Auth::guard('administrador')->check())
    $(document).ready(function(){
      $("#buscar").on("keyup", function() {
        var value = $(this).val().toLowerCase();
        $("#materias tr").filter(function() {
          $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
        });
      });
    });
    @endif
</script>
@stop