@extends(layoutTenant())

@section('content')
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <h4 class="page-title float-left">Editar Notícia</h4>


                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    @if (session('success'))

        <div class="alert alert-success">
            {{ session('success') }}
        </div>

    @endif
    @if (session('erro'))

        <div class="alert alert-danger">
            {{ session('erro') }}
        </div>

    @endif
    <div class="row">
        <!-- ============================================================== -->
        <!-- basic form -->
        <!-- ============================================================== -->
        <div class="col-xl-9 col-lg-9col-md-9 col-sm-12 col-12">
            <div class="card">
                <h5 class="card-header">Editar Notícia</h5>
                <div class="card-body">

                    {!! Form::model($category, ['url'=>routeTenant('noticias.update', [$category->id]),'enctype'=>'multipart/form-data','method' => 'PUT','id'=>'enviarimagem']) !!}



                    @include('app.noticia._form')





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

        <div class="col-xl-3 col-lg-3col-md-3 col-sm-12 col-12">

            <div class="card ">
                <h5 class="card-header ">Editar Notícia</h5>
                <div class="card-body">
                    <div class="form-group">
                        <div class="form-group">
                            {!! Form::submit('Salvar Noticia', ['class'=>'btn btn-primary','style'=>'margin-top: 10px;','name'=>'criar']) !!}
                            {!! Form::submit('Salvar e Editar', ['class'=>'btn btn-warning','name'=>'editar','style'=>'margin-top: 10px; color: #000;']) !!}


                        </div>

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

            <div class="card ">
                <h5 class="card-header ">Categorias </h5>
                <div class="card-body">
                    <div class="form-group">
                        <select name="category_id" class="custom-select" required>
                            <option >Selecione uma Categoria</option>
                            @foreach($categorys as $categor)
                                <option
                                        @if($category->category_id == $categor->id)
                                        selected="selected"
                                        @endif
                                        value="{{$categor->id}}"> {{$categor->name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>

            <div class="card imgdestacada">
                <h5 class="card-header ">Imagem destacada</h5>
                <div class="card-body">
                    <div class="form-group text-center">

                        <input type="file" id="upload_file" name="img" />
                        <div class=" mudarimagem" style="text-align: center">
                            <a  onclick="add('')" style="color: #FFF; padding: 3px; margin-left: 20%; margin-bottom: 30px; " class="  btn btn-danger  mudarimagem2">Trocar de Imagem </a></div>
                            <a  onclick="add2('')" style="color: #FFF; padding: 3px; margin-left: 20%; margin-bottom: 30px; " class="  hide btn btn-danger  mudarimagem3">Trocar de Imagem </a></div>
                        <img class="fecharimg" src="{{asset($category->img)}}" alt="">

                        <label id="upload_btn" for="upload_file">
                            <img class="image hide" width="100%" src=" {{asset('assets/images//Placeholder.jpg')}}"/>
                        </label>

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

    {!! Form::close() !!}
    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header bg-danger">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title " style="color: #FFF;" >Deletar Imagem</h4>
                </div>
                <div class="modal-body">
Tem certeza que deseja Deletar essa imagem ?
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                    <a type="button" class="btn btn-danger" id="link" style="color: #FFF;"  >Deletar</a>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('post-script')

    {!!  config('tenant.editor') !!}


    <script>
        function readURL(input) {



            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $img = $('<img/>').attr('src', e.target.result).attr('class', 'fecharimg');
                    $('.mudarimagem').append($img);
                    $('.image').addClass('hide');
                    $('.mudarimagem3').addClass('show23');
                }

                reader.readAsDataURL(input.files[0]);
            }
        }


        $('body').on("change", "input[name=img]", function() {

            readURL(this);


        });
        function add(value){
            //$(".imgdestacada").load('create .imgdestacada');

            $('.image').removeClass('hide');
            $('.fecharimg').remove();
            $('.mudarimagem2').addClass('hide');

        }
        function add2(value){
            $(".imgdestacada").load('edit .imgdestacada');



        }

        $(document).ready(function(){

            $('#exampleModal').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget) // Button that triggered the modal
                var recipient = button.data('whatever') // Extract info from data-* attributes
                // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
                // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
                var modal = $(this)
                modal.find('#link').attr('href',recipient)
            })





            $("input[name=url_imagem2]").change(function(){
                $('#enviarimagem').submit();
                console.log('madara');
            });
        });
    </script>
    <script type="text/javascript" src="{{url('')}}/css/src/js/lightbox.js"> </script>
    <link href="{{url('')}}/css/src/css/lightbox.css" rel="stylesheet" />
@endsection