@include('admin.header', [
   'elementActive' => 'songs'
])

<div class="content-wrapper">

    <section class="content-header">
      <h1>
      Pediso de Músicas	      <small> Gerencie os pedidos de música</small>
      </h1> 
    </section>

    <!-- Main content -->
    <section class="content">
    <div class="row">
        
        <div class="col-xs-12">   
           
    


            <div class="tab-content">

          <form action="" method="post" id="form_apagar" name="form_apagar">

            <!-- box -->
            <div class="box">
                <div class="box-body">

                    <div style="text-align:left;">

                        <button type="button" class="btn btn-danger" onclick="deletesongrequestitems()">Apagar selecionados</button>

                    </div>		
                    <br/>         
                    <form class="form-group">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" name="enable" id="enable" {{ $enable ? 'checked' : '' }} onclick="enableSongsRequest()" id="flexCheckDefault">
                            <label class="form-check-label" for="flexCheckDefault">
                              Habilitar pedidos de músicas
                            </label>
                          </div>
                        </form>

                  <input type="input" name="songrequestitems" id="songrequestitems" hidden/>
                        <script>
                            function deletesongrequestitems(){
                                if($('#songrequestitems').val().length === 0){
                                    alert('Selecione pelo menos um item a ser excluído');
                                }else{
                                    if (confirm('Apagar todos os itens selecionados?')) {
                                        $(':button').prop( "disabled", true );
                                        $.ajax({
                                            headers: {
                                                'X-CSRF-Token': "{{ csrf_token() }}",
                                            },
                                            type: 'DELETE',
                                            url: "{{ URL::to('admin/songrequests/destroy')}}/"+btoa($('#songrequestitems').val()),
                                            data: {},
                                            enctype: 'multipart/form-data',
                                            success: function(data){
                                                location.reload();
                                            },
                                            error: function(data){
                                                alert('Falhou ao deletar');
                                                $(':button').prop( "disabled", false );
                                            }
                                        });
                                    }
                                }
                            }
                            function multiselectsongrequestitems(checkbox, id){
                                if(checkbox == 'on'){
                                    $('#songrequestitems').val($('#songrequestitems').val()+id+':');
                                }else{
                                    $('#songrequestitems').val($('#songrequestitems').val().replace(id+':', ''));
                                }
                            }
                        </script>


                    <table class="table table-bordered table-striped">

                        <thead>
                            <tr>
                                <th>Item</th>
                                <th>Titulo</th>
                                <th>Ouvinte</th>
                                <th>Opt.</th>
                            </tr>
                        </thead>
                        
                        <tbody>
                        
                            @foreach ($songrequests as $songrequest)
                            <tr id="{{ $songrequest->id }}">
                                <td style="cursor:pointer;"><input type="checkbox" onclick="multiselectsongrequestitems($(this).filter(':checked').val(), {!!  $songrequest->id !!});" /></td>
                                <td style="cursor:pointer;">{{ $songrequest->name }}</td>
                                <td style="cursor:pointer;">{{ $songrequest->listener }}</td>
                                <td>

                                    <input type="button" class="btn btn-primary" value="Ouvir" onclick="window.open('https://www.youtube.com/results?search_query={{ $songrequest->name }}', '_blank');"/>
                                    <input type="button" class="btn btn-danger" value="Apagar" onclick="if (confirm('Excluir o música selecionada?')) { $('#delete_{{ $songrequest->id }}').submit(); }" />
                                    <form action="{{ route('admin.songrequests.destroy', $songrequest->id) }}" method="post" id="delete_{{ $songrequest->id }}" hidden>
                                        @csrf
                                        @method('DELETE')
                                    </form>

                                </td>
                            </tr>
                            @endforeach
                                
                                
                        </tbody>

                    </table>

                    <div class="col-12">
                     <div class="col-12 text-right">
                        {!! $songrequests->links("pagination::bootstrap-4") !!}

                     </div>
                 </div>

                </div>

            </div>
            <!-- /.box -->

        </form>

      </div>
       

    </div>
    <!-- /.row -->
</section>
<!-- /.content -->

</div>
@include('admin.footer')





<script>
    function enableSongsRequest(){
        $('#enable').prop( "disabled", true );
        $.ajax({
            headers: {
                    'X-CSRF-Token': "{{ csrf_token() }}",
            },
            type: 'PUT',
            url: "{{ route('admin.songrequests.update') }}",
            data: { 
                enable: $('#enable').is(':checked')
            },
            enctype: 'multipart/form-data',
            success: function(data){
                $('#enable').prop( "disabled", false );
            },
            error: function(data){
                $('#enable').prop( "disabled", false );
                console.log('Erro no Ajax !');
            }
        });
    }
</script>