@extends('layouts.frontend')

@section('title', $product->exists ? 'Editar producto' : 'Añadir producto')

@section('content')
    <article id="user">
        <section class="content">
            <div class="container">
                @if($status)
                    <div class="alert alert-success">
                        <p>{{ $status }}</p>
                    </div>
                @endif
                @if($errors->any())
                    <div class="alert alert-danger">
                        @foreach($errors->all() as $error)
                            <p>{{ $error }}</p>
                        @endforeach
                    </div>
                @endif

                <div class="row row-grid">
                    <div class="col-md-3 col-auto">
                        @include('partials.sidebar')
                    </div>
                    <div class="col-md-9 col">
                        {!! Form::model($product, [
                            'files' => true
                        ]) !!}
                        <div class="row row-grid">
                            <div class="col-md-8">
                                <label>Nombre</label>
                                {!! Form::text('post[title]', null, ['class' => 'form-control', 'required']) !!}
                            </div>
                            <div class="col-md-4">
                                <label>Precio</label>
                                {!! Form::text('price', null, ['class' => 'form-control number']) !!}
                            </div>
                            <div class="col-12">
                                <label>Descripción</label>
                                {!! Form::textarea('post[excerpt]', null, ['class' => 'form-control']) !!}
                            </div>
                            <div class="col-12">
                                <label>Imagen</label>
                                <div class="dropzone">
                                    <i class="fa fa-image" @if($product->image) style="display: none;" @endif></i>
                                    {!! Form::file('image', ['id' => 'image']) !!}
                                    <img id="preview" src="{{ asset($product->image) }}" alt="" class="absolute">
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="btn-container">
                                    <button class="btn" type="submit">Guardar</button>
                                    @if($product->exists)
                                    <a href="{{ route('product.delete', $product->id) }}" class="btn btn-danger">
                                        <span>Eliminar</span>
                                    </a>
                                    @endif
                                </div>
                            </div>
                        </div>
                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
        </section>
    </article>
@endsection

@section('scripts')
    <script>
      function readURL(input) {
        if (input.files && input.files[0]) {
          var reader = new FileReader();
          reader.onload = function(e) {
            $('#preview').attr('src', e.target.result);
            $('.dropzone i').hide();
          }
          reader.readAsDataURL(input.files[0]);
        }
      }

      $(function() {
        $('#image').change(function () {
          readURL(this);
        });

        $('.number').number(true, 0, ',', '.');
      });
    </script>
@endsection