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

<div class="content-wrapper">

    <section class="content-header">
      <h1>
      Publicidades	      
      <small>Adicione imagens dos patrocinadores</small> 
      
      </h1> 
    </section>


    <section class="content">
        <div class="row">
           <div class="col-xs-12">
              <div class="nav-tabs-custom">
                 <ul class="nav nav-tabs ">
                    <li {!! $active == 'top' || $active == false ? 'class="active"' : '' !!}>
                       <a href="#emails" data-toggle="tab" aria-expanded="true">Anúncio principal</a>
                    </li>
                    <li {!! $active == 'side' ? 'class="active"' : '' !!}>
                       <a href="#ads2" data-toggle="tab" aria-expanded="false">Anúncio lateral</a>
                    </li>
                    <li {!! $active == 'footer' ? 'class="active"' : '' !!}>
                       <a href="#meta" data-toggle="tab" aria-expanded="false">Anúncios do rodapé</a>
                    </li>
                    <li {!! $active == 'colors' ? 'class="active"' : '' !!}>
                     <a href="#colors" data-toggle="tab" aria-expanded="false">Cores</a>
                  </li>
                 </ul>
                 <div class="tab-content">
                    <div id="emails" class="tab-pane {!! $active == 'top' || $active == false ? 'active' : '' !!}">

                        <div >
                            <img src="{{  asset($ad_top->image) }}" style="border:0px; max-width:1080px;">
                        </div>
                        <br/>
                        <div class="col-2">
                        <form action="{{ route('admin.ads.update', 'top') }}" method="post" class="form-group" enctype="multipart/form-data">
                            @csrf
                            @method('PUT')
                                <input type="text" name="id_ad" value="{{  $ad_top->id }}" hidden />
                                <fieldset> 
                                  <label>Imagem</label> 
                                  <div class="fileupload fileupload-new" data-provides="fileupload">
                                      <div class="input-append">
                                        <div class="uneditable-input">
                                          <i class="fa fa-file fileupload-exists"></i>
                                          <span class="fileupload-preview"></span>
                                        </div>
                                        <span class="btn btn-default btn-file">
                                        <span class="fileupload-exists">Alterar</span>
                                        <span class="fileupload-new">Procurar arquivo</span>
                                          <input type="file" name="file">
                                        </span>
                                        <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                                      </div>
                                  </div>
       
                                </fieldset>
                                <br>
                                <span style="color: #ff0000;"><strong>Tamanho ideal: Largura 1147 x Altura 143</strong></span>
                                <br/>
                                <br/>
                                <div class="form-group">
                                 <label>Destino</label>
                                 
                                    <input name="url" type="text" class="form-control" placeholder="http://google.com.br" value="{{ $ad_top->url }}">
                                 
                              </div>
                                <div class="form-check">
                                 <input class="form-check-input" type="checkbox" name="enable" {{  $ad_top->enable == true ? 'checked' : '' }} id="flexCheckDefault">
                                 <label class="form-check-label" for="flexCheckDefault">
                                   Habilitar anúncio
                                 </label>
                               </div>
                               
                                <div style="text-align:left; padding-top:10px;">
                                  <button type="submit" class="btn btn-primary">Salvar</button>
                                  
                                </div>
                                
                            </form>
                    </div>

 
                        
                    </div>



                    <div id="ads2" class="tab-pane {!! $active == 'side' ? 'active' : '' !!}">

                        <div >
                            <img src="{{  asset($ad_side->image) }}" style="border:0px; max-width:1080px;">
                        </div>
                        <br/>
                        <div class="col-2">
                        <form action="{{ route('admin.ads.update', 'side') }}" method="post" class="form-group" enctype="multipart/form-data">
                            @csrf
                            @method('PUT')
                                <input type="text" name="id_ad" value="{{  $ad_side->id }}" hidden/>
                                <fieldset> 
                                  <label>Imagem</label> 
                                  <div class="fileupload fileupload-new" data-provides="fileupload">
                                      <div class="input-append">
                                        <div class="uneditable-input">
                                          <i class="fa fa-file fileupload-exists"></i>
                                          <span class="fileupload-preview"></span>
                                        </div>
                                        <span class="btn btn-default btn-file">
                                        <span class="fileupload-exists">Alterar</span>
                                        <span class="fileupload-new">Procurar arquivo</span>
                                          <input type="file" name="file">
                                        </span>
                                        <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                                      </div>
                                  </div>
                                  
                                </fieldset>
                                <br>
                                
                                <span style="color: #ff0000;"><strong>Tamanho ideal: Largura 434 x Altura 144</strong></span>
                                <br/>
                                <br/>

     
                                <div class="form-group">
                                 <label>Destino</label>
                                 
                                    <input name="url" type="text" class="form-control" placeholder="http://google.com.br" value="{{ $ad_side->url }}">
                                 
                              </div>

                     
                                
                                <div class="form-check">
                                 <input class="form-check-input" type="checkbox" name="enable" {{  $ad_side->enable == true ? 'checked' : '' }} id="flexCheckDefault">
                                 <label class="form-check-label" for="flexCheckDefault">
                                   Habilitar anúncio
                                 </label>
                               </div>

                               

                               
                                <div style="text-align:left; padding-top:10px;">
                                  <button type="submit" class="btn btn-primary">Salvar</button>
                                  
                                </div>
                                
                            </form>
                    </div>

 
                        
                    </div>


                    <div id="meta" class="tab-pane {!! $active == 'footer' ? 'active' : '' !!}">
                        <div class="tab-content">
                            <div id="meta" class="tab-pane active">
                                <div style="text-align:left;">
        
                                    <button type="button" class="btn btn-primary" onclick="openModalCreate()">Novo</button>
                                    <button type="button" class="btn btn-danger" onclick="deleteadsitems()">Apagar selecionados</button>
            
                                <br/>
                                <br/>
                                    <form class="form-group">
                                       <div class="form-check">
                                           <input class="form-check-input" type="checkbox" name="enable" id="enable" {{ $enable ? 'checked' : '' }} onclick="enableAds()" id="flexCheckDefault">
                                           <label class="form-check-label" for="flexCheckDefault">
                                             Habilitar anúncios no rodapé
                                           </label>
                                         </div>
                                       </form>				         
                                        
                                </div>			         
            
                     
                                <input type="input" name="adsitems" id="adsitems" hidden/>
                                <script>
                                    function deleteadsitems(){
                                        if($('#adsitems').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/ads/delete')}}/"+btoa($('#adsitems').val()),
                                                    data: {},
                                                    enctype: 'multipart/form-data',
                                                    success: function(data){
                                                        location.reload();
                                                    },
                                                    error: function(data){
                                                        alert('Falhou ao deletar');
                                                        $(':button').prop( "disabled", false );
                                                    }
                                                });
                                            }
                                        }
                                    }
                                    function multiselectadsitems(checkbox, id){
                                        if(checkbox == 'on'){
                                            $('#adsitems').val($('#adsitems').val()+id+':');
                                        }else{
                                            $('#adsitems').val($('#adsitems').val().replace(id+':', ''));
                                        }
                                    }
                                </script>
                                
                                <table class="table table-bordered table-hover">
            
                                    <thead>
                                        <tr>
        
                                          <th>Item</th>
                                            <th>Titulo</th>
                                            <th>Imagem</th>
                                            <th>Opt.</th>
                                        </tr>
                                    </thead>
                                    
                                    <tbody>
                                    
                                        @foreach ($ads as $ad)
                                            
                                            <tr id="{{ $ad->id }}">
          
                                             <td style="cursor:pointer;"><input type="checkbox" onclick="multiselectadsitems($(this).filter(':checked').val(), {!!  $ad->id !!});" /></td>
                                                <td onclick="" style="cursor:pointer;">{{ $ad->title }}</td>
                                                <td><img width="80px" src="{{ asset($ad->image) }}"/></td>
                                                
                                                <td>

                                                    <input type="button" class="btn btn-primary" value="Editar" onclick="openModalEdit({{ $ad->id }}, '{{ $ad->title }}', '{{ $ad->url }}', '{{ asset($ad->image) }}')"/>
                                                    <input type="button" class="btn btn-danger" value="Apagar" onclick="if (confirm('Excluir a publicidade selecionada?')) { $('#delete_{{ $ad->id }}').submit(); }" />
                                                    <form action="{{ route('admin.ads.destroy', $ad->id) }}" method="post" id="delete_{{ $ad->id }}" hidden>
                                                        @csrf
                                                        @method('DELETE')
                                                    </form>

                                                </td>
                                            </tr>

                                        @endforeach
                                        </tbody>
            
                                </table>
            
                            </div>
            
                        </div>  
                    </div>


                    







                     <div id="colors" class="tab-pane {!! $active == 'colors' ? 'active' : '' !!}">
                        <div class="tab-content">
                           <div class="tab-pane active">
         
                              
                              <div id="cores" class="tab-pane {!! $active == 'colors' ? 'active' : '' !!}">
                                 <form action="{{ route('admin.ads.update', 'colors') }}" class="form-horizontal" method="post">
                                    @csrf
                                    @method('PUT')
            
                                    <div class="col-md-5">
                                       @foreach ($adsColors as $adsColor)
                                          @if ($adsColor->type == 'top')
                                             <div class="row" style="margin-left:15px;">
                                                <div class="col-md-3 form-group">
                                                   <label for="top_color">Anúncio Principal</label>
                                                   <input type="color" id="top_color" name="top_color" onchange="clickColor(0, -1, -1, 5)" value="{{ $adsColor->color }}" style="width:85%;height: 36px;">
                                                </div>
                                                <div class="col-md-9 form-group">
                                                <label for="background_file"><br/></label>
                                                <div class="fileupload fileupload-new" data-provides="fileupload">
                                                   <div class="input-append">
                                                      <div class="uneditable-input">
                                                      <i class="fa fa-file fileupload-exists"></i>
                                                      <span class="fileupload-preview"></span>
                                                      </div>
                                                      <span class="btn btn-default btn-file">
                                                      <span class="fileupload-exists">Alterar</span>
                                                      <span class="fileupload-new">Procurar arquivo</span>
                                                      <input type="file" name="top_background">
                                                      </span>
                                                      <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                                                   </div>
                                                </div>
                                                </div>
                                             </div>
                                          @elseif ($adsColor->type == 'footer')
                                             <div class="row" style="margin-left:15px;">
                                                <div class="col-md-3 form-group">
                                                   <label for="footer_color">Anúncio Rodapé</label>
                                                   <input type="color" id="footer_color" name="footer_color" onchange="clickColor(0, -1, -1, 5)" value="{{ $adsColor->color }}" style="width:85%;height: 36px;">
                                                </div>
                                                <div class="col-md-9 form-group">
                                                <label for="background_file"><br/></label>
                                                <div class="fileupload fileupload-new" data-provides="fileupload">
                                                   <div class="input-append">
                                                      <div class="uneditable-input">
                                                      <i class="fa fa-file fileupload-exists"></i>
                                                      <span class="fileupload-preview"></span>
                                                      </div>
                                                      <span class="btn btn-default btn-file">
                                                      <span class="fileupload-exists">Alterar</span>
                                                      <span class="fileupload-new">Procurar arquivo</span>
                                                      <input type="file" name="footer_background">
                                                      </span>
                                                      <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                                                   </div>
                                                </div>
                                                </div>
                                             </div>
                                          @endif
                                          
                                       @endforeach
                                    </div>
            
                                       
                                    <div class="col-md-7">
                                       <style>
                                           iframe {
                                               width: 900px;
                                               height: 400px;
                                               overflow: auto;
                                           }
                                       </style>
                                       <label for="color">Pré-visualização</label>
                                       <iframe src="{{ route('home.index') }}" frameborder="0" width="100%" height="400"></iframe>
                                   </div>
                                       
                                       
                                                                     
                                    <div style="padding-top:15px;">
                                       <button type="submit" class="btn btn-primary">Salvar</button>
                                    </div>
            
                                 </form>
                                 </div>

                              {{-- <div class="form-group">
                                 <label>Background</label>
                                 <div class="fileupload fileupload-new" data-provides="fileupload">
                                    <div class="input-append">
                                    <div class="uneditable-input">
                                       <i class="fa fa-file fileupload-exists"></i>
                                       <span class="fileupload-preview"></span>
                                    </div>
                                    <span class="btn btn-default btn-file">
                                    <span class="fileupload-exists">Alterar</span>
                                    <span class="fileupload-new">Procurar arquivo</span>
                                       <input type="file" name="file">
                                    </span>
                                    <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                                    </div>
                              </div>
                              </div>
                              <div class="form-group">
                                 <label>Cor de fundo</label>
                                 <div class="input-append">
                                    <input type="color" id="secondary" name="secondary" onchange="clickColor(0, -1, -1, 5)" value="#000000" style="width:15%;">
                                 </div>
                              </div> --}}
            
                           </div>
            
                        </div>  
                     </div>
                    
















         
                    <div id="imagem" class="tab-pane">
                      <form action="http://localhost/admin/settings/update" class="form-horizontal" method="post">
                         <input type="hidden" name="_token" value="vzJRDdciiOjIg1ViLwks2feoTwp2R9LR2jGqLnRc">                        <input type="hidden" name="_method" value="POST">                      <div><img src="https://radiosementesdeesperanca.com.br/admin/arquivos/img_logo/475776ff245c65f9a446e7cb55f35f21f883d228.jpg" style="border:0px; max-width:300px;"></div>
                       <div style="padding-top:10px">
                          <button type="button" class="btn btn-primary" onclick="confirma('https://radiosementesdeesperanca.com.br/admin/config/apagar_logo');">Apagar Imagem</button>
                       </div>
                      </form>
                    </div>
                 </div>
              </div>
           </div>
           <!-- /.row -->
        </div>
     </section>
    

</div>


@include('admin.footer')





<script>
   function enableAds(){
      $('#enable').prop( "disabled", true );
        $.ajax({
            headers: {
                    'X-CSRF-Token': "{{ csrf_token() }}",
            },
            type: 'PUT',
            url: "{{ route('admin.ads.update', 'enable') }}",
            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 !');
            }
        });
   }
    function openModalCreate(){
        $('#id_ad').val('');
        $('#title').val('');
        $('#url').val('');

        $("#create").modal();
    }
    function openModalEdit(id, title, url, image){
        $('#id_ad').val(id);
        $('#title').val(title);
        $('#url').val(url);
        $("#image").attr("src",image);

        $("#update").modal();
    }
</script>



<div id="update" class="modal fade" role="dialog">
<div class="modal-dialog modal-md">
   <!-- Modal content-->
   <div class="modal-content" id="conteudo_modal">
      <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal">×</button>
         <h5 class="modal-title modal_titulo">Editar anúncio</h5>
      </div>
      <div class="modal-body" id="modal_conteudo_m">
         <style type="text/css">
            .bootstrap-timepicker-widget table{
            background-color: #fff !important;
            }
         </style>
         <form action="{{ route('admin.ads.update', 'footer') }}" class="form-horizontal" method="post" enctype="multipart/form-data">
             @csrf
             @method('PUT')
             <input type="id_schedule" name="id_ad" id="id_ad" hidden />
            <fieldset>
               <div class="form-group">
                  <label class="col-md-12">Nome do anúncio</label>
                  <div class="col-md-12">
                     <input name="title" id="title" type="text" class="form-control">
                  </div>
               </div>
               <div class="form-group">
                  <label class="col-md-12">Destino</label>
                  <div class="col-md-12">
                     <input name="url" id="url" type="text" class="form-control" placeholder="http://google.com.br">
                  </div>
               </div>
               <div class="form-group">
                  <label class="col-md-12">Imagem</label>
                  <div class="col-md-12">
                     <center><img id="image" src="" width="300px"/></center>

                     <fieldset> 
                        <label>Imagem</label> 
                        <div class="fileupload fileupload-new" data-provides="fileupload">
                            <div class="input-append">
                              <div class="uneditable-input">
                                <i class="fa fa-file fileupload-exists"></i>
                                <span class="fileupload-preview"></span>
                              </div>
                              <span class="btn btn-default btn-file">
                              <span class="fileupload-exists">Alterar</span>
                              <span class="fileupload-new">Procurar arquivo</span>
                                <input type="file" name="file">
                              </span>
                              <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                            </div>
                        </div>
                      </fieldset>
                      <br>
                      <span style="color: #ff0000;"><strong>Tamanho ideal: Largura 474 x Altura 248</strong></span>


                  </div>
               </div>
               <div style="text-align: left; width: 100%;">
                  <button type="submit" class="btn btn-primary">Salvar</button>
               </div>
            </fieldset>
         </form>
      </div>
      <div class="modal-footer">
         <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
      </div>
   </div>
</div>
</div>

<div id="create" class="modal fade" role="dialog">
   <div class="modal-dialog modal-md">
      <!-- Modal content-->
      <div class="modal-content" id="conteudo_modal">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">×</button>
            <h5 class="modal-title modal_titulo">Criar anúncio</h5>
         </div>
         <div class="modal-body" id="modal_conteudo_m">
            <style type="text/css">
               .bootstrap-timepicker-widget table{
               background-color: #fff !important;
               }
            </style>
            <form action="{{ route('admin.ads.store') }}" class="form-horizontal" method="post" enctype="multipart/form-data">
                @csrf
                @method('POST')
                <input type="id_schedule" name="id_ad" id="id_ad" hidden />
               <fieldset>
                  <div class="form-group">
                     <label class="col-md-12">Nome do anúncio</label>
                     <div class="col-md-12">
                        <input name="title" id="title" type="text" class="form-control">
                     </div>
                  </div>
                  <div class="form-group">
                     <label class="col-md-12">Destino</label>
                     <div class="col-md-12">
                        <input name="url" id="url" type="text" class="form-control" placeholder="http://google.com.br">
                     </div>
                  </div>
                  <div class="form-group">
                     {{-- <label class="col-md-12">Imagem</label> --}}
                     <div class="col-md-12">
                        <fieldset> 
                           <label>Imagem</label> 
                           <div class="fileupload fileupload-new" data-provides="fileupload">
                               <div class="input-append">
                                 <div class="uneditable-input">
                                   <i class="fa fa-file fileupload-exists"></i>
                                   <span class="fileupload-preview"></span>
                                 </div>
                                 <span class="btn btn-default btn-file">
                                 <span class="fileupload-exists">Alterar</span>
                                 <span class="fileupload-new">Procurar arquivo</span>
                                   <input type="file" name="file">
                                 </span>
                                 <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>
                               </div>
                           </div>
                         </fieldset>
                         <br>
                         <span style="color: #ff0000;"><strong>Tamanho ideal: Largura 474 x Altura 248</strong></span>
   
   
                     </div>
                  </div>
                  
                  <div style="text-align: left; width: 100%;">
                     <button type="submit" class="btn btn-primary">Salvar</button>
                  </div>
               </fieldset>
            </form>
            <script type="text/javascript">
               $(document).ready(function() {
               
                 $('.timepicker').timepicker({
                   showInputs: false,
                   showMeridian: false
                 });
               
               });
            </script>
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
         </div>
      </div>
   </div>
   </div>