@extends('admin.layouts.app')
@section('content')
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>Products</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="{{ url('admin') }}">Home</a></li>
                            <li class="breadcrumb-item"><a href="{{ url('admin/products') }}">Products</a></li>
                            <li class="breadcrumb-item active">Add New</li>
                        </ol>
                    </div>
                </div>
            </div><!-- /.container-fluid -->
        </section>


        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif

                        @if(session()->has('error_message'))
                            <div class="alert alert-danger">
                                {{ session()->get('error_message') }}
                            </div>
                        @endif
                        <div class="card">

                            <div class="card-header">
                                <h3 class="card-title">Edit</h3>
                            </div>


                            <!-- /.card-header -->
                            <div class="card-body">
                                <form method="POST" action="{{ route('updateProduct',$product->id) }}" enctype="multipart/form-data">
                                    {{ csrf_field() }}
                                    {{ method_field('put') }}
                                    <div class="form-group">
                                        <label>Product Name</label>
                                        <input type="text" name="product_name" required value="{{$product->product_name}}" class="form-control" />
                                    </div>

                                    <div class="form-group">
                                        <label><strong>Product Title</strong></label>
                                        <input type="text" name="product_title" required value="{{$product->title}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label><strong>Product Slug</strong></label>
                                        <input type="text" name="product_slug" required value="{{$product->slug}}" class="form-control" />
                                    </div>

                                    <div class="form-group">
                                        <label>Product Description</label>
                                        <textarea class="ckeditor form-control" required name="product_description">{{$product->short_description}}</textarea>
                                    </div>
                                    <div class="form-group">
                                        <label>Product Detail</label>
                                        <textarea class="ckeditor form-control" required name="product_detail" >{{$product->description}}</textarea>
                                    </div>
                                    {{--
                                    <div class="form-group">
                                        <label>InternalLink</label>
                                        <input type="text" name="InternalLink" value="{{old('InternalLink')}}" class="form-control" />

                                    </div>--}}
                                    <div class="form-group">
                                        <label>Meta Title</label>
                                        <input type="text" name="meta_title" required value="{{$product->meta_title}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label>Meta Keywords</label>
                                        <input type="text" name="meta_keywords" required value="{{$product->meta_keywords}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label for="meta_descriptions">Meta Descriptions</label>
                                        <input type="text" id="meta_descriptions" required name="meta_descriptions" value="{{$product->meta_description}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label>Is Home</label>
                                        <select type="number" name="is_home" required value="{{old('is_home')}}" class="form-control">
                                            <option value="0" {{ $product->is_home=="0" ? "selected" : ''}}>0</option>
                                            <option value="1" {{ $product->is_home=="1" ? "selected" : ''}}>1</option>
                                        </select>



                                    </div>
                                    <div class="form-group">
                                        <label>status</label>
                                        <select type="text" class="form-control" required name="meta_status">
                                            <option value="0" {{ $product->status=="0" ? "selected" : ''}}>0</option>
                                            <option value="1" {{ $product->status=="1" ? "selected" : ''}}>1</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label>Twitter Banner</label>
                                        <br>
                                        @if($product->twitterbanner)
                                            <img  src="{{ asset("public/assets/images/".$product->twitterbanner) }}" class="thumbnail" style="width: 24%;margin-bottom: 12px;">
                                        @endif
                                        <input type="file"  name="timage"  value="{{old('timage')}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label>Facebook Banner</label>
                                        <br>
                                        @if($product->facebookbanner)
                                            <img  src="{{ asset("public/assets/images/".$product->facebookbanner) }}" class="thumbnail" style="width: 24%;margin-bottom: 12px;">
                                        @endif
                                        <input type="file"  name="fbimage" value="{{old('fbimage')}}" class="form-control" />
                                    </div>
                                    <div class="row">
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Front image</label>
                                                <br>


                                                <input type="file"  name="fimage"  value="{{old('image')}}" class="form-control" />
                                            </div>
                                            @if($product->front_image)
                                                <img  src="{{ asset("public/assets/images/products/".$product->front_image) }}" class="thumbnail" style="width: 24%;margin-bottom: 12px;">
                                            @endif
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Front Image Alt</label>
                                                <input type="text"  name="front_alt"  value="{{$product->front_image_alt}}" class="form-control" />
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Front Image Title</label>
                                                <input type="text"  name="front_title"  value="{{$product->front_image_title}}" class="form-control" />
                                            </div>
                                        </div>
                                    </div>


                                    <div class="row">
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Back Image</label><br>

                                                <input type="file"  name="bimage"  value="{{old('bimage')}}" class="form-control" />
                                            </div>
                                            @if($product->back_image_alt)
                                                <img  src="{{ asset("public/assets/images/products/".$product->back_image) }}" class="thumbnail" style="width: 24%;margin-bottom: 12px;">
                                            @endif
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Back Image Alt</label>
                                                <br>
                                                <input type="text"  name="back_alt"  value="{{$product->back_image_alt}}" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Back Image Title</label>
                                                <br>
                                                <input type="text"  name="back_title"  value="{{$product->back_image_title}}" class="form-control" />
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-4">
                                            Gallery Image *
                                        </div>
                                    </div>
                                    <div class="row" id="a_clones">
                                        @foreach($product_image as $pi)

                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label>Image</label>
                                                    <input type="file"  name="image[]"  value="{{old('image')}}" class="form-control" />
                                                </div>
                                                @if($pi->image)
                                                    <img  src="{{ asset("public/assets/images/product_gallery/".$pi->image) }}" class="thumbnail" style="width: 24%;margin-bottom: 12px;">
                                                @endif
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label> Image Alt</label>
                                                    <input type="text"  name="alt[]" required value="{{$pi->alt}}" class="form-control" />
                                                </div>
                                            </div>

                                            <div class="col-md-3">
                                                <div class="form-group">
                                                    <label> Image Title</label>
                                                    <input type="text"  name="title[]" required value="{{$pi->title}}" class="form-control" />
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>


                                    <div class="row" id="a_clone" style="display: none">
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Image</label>
                                                <input type="file"  name="image[]"  value="{{old('image')}}" class="form-control" />
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label> Image Alt</label>
                                                <input type="text"  name="alt[]"  value="{{old('alt')}}" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="col-md-3">
                                            <div class="form-group">
                                                <label> Image Title</label>
                                                <input type="text"  name="title[]"  value="{{old('title')}}" class="form-control" />
                                            </div></div>


                                    </div>
                                    <div id="b_clone"></div>
                                    <div class="col-md-4">
                                        <button type="button" id='btn_clone'class="btn btn-dark">Add Row</button>
                                    </div>
                                    <div class="form-group text-center">
                                        <button type="submit" class="btn btn-success btn-md">Submit</button>
                                    </div>
                                </form>
                            </div>
                            <!-- /.card-body -->
                        </div>
                        <!-- /.card -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.container-fluid -->
        </section>
        <!-- /.content -->
    </div>



@endsection
@push('scripts')
    <script src="//cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('.ckeditor').ckeditor();
        });



        $(document).ready(function(){
            $("#btn_clone").click(function(){
                $("#a_clone").clone().find("input").val("").end().show().appendTo("#b_clone").append('<div class="col-md-1"><label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label><br><button type="button" class="mb-xs mr-xs btn btn-info removemore btn-sm">Remove</button></div>');
            });
        });
        $(document).on('click', '.removemore', function () {
            $(this).parent().parent().remove();
        });
    </script>
@endpush