@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">Add</h3>
                            </div>
                            <!-- /.card-header -->
                            <div class="card-body">
                                <form method="POST" action="{{ route('storeProduct') }}" enctype="multipart/form-data">
                                    @csrf
                                    <div class="form-group">
                                        <label>Product Name</label>
                                        <input type="text" name="product_name" required value="{{old('product_name')}}" class="form-control" />
                                    </div>

                                    <div class="form-group">
                                        <label><strong>Product Title</strong></label>
                                        <input type="text" name="product_title" required value="{{old('product_title')}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label><strong>Product Slug</strong></label>
                                        <input type="text" name="product_slug" required value="{{old('product_slug')}}" class="form-control" />
                                    </div>

                                    <div class="form-group">
                                        <label>Product Description</label>
                                        <textarea class="ckeditor form-control" required name="product_description">{{old('product_description')}}</textarea>
                                    </div>
                                    <div class="form-group">
                                        <label>Product Detail</label>
                                        <textarea class="ckeditor form-control" required name="product_detail" >{{old('product_detail')}}</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="{{old('meta_title')}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label>Meta Keywords</label>
                                        <input type="text" name="meta_keywords" required value="{{old('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="{{old('meta_descriptions')}}" 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">0</option>
                                            <option value="1">1</option>
                                        </select>



                                    </div>
                                    <div class="form-group">
                                        <label>status</label>
                                        <select type="text" class="form-control" required name="meta_status">
                                            <option value="0">0</option>
                                            <option value="1">1</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label>Twitter Banner</label>
                                        <input type="file"  name="timage"  value="{{old('timage')}}" class="form-control" />
                                    </div>
                                    <div class="form-group">
                                        <label>Facebook Banner</label>
                                        <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>
                                                <input type="file"  name="fimage" required value="{{old('image')}}" class="form-control" />
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Front Image Alt</label>
                                                <input type="text"  name="front_alt" required value="{{old('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" required value="{{old('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>
                                                <input type="file"  name="bimage" required value="{{old('bimage')}}" class="form-control" />
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Back Image Alt</label>
                                                <input type="text"  name="back_alt" required value="{{old('back_image_alt')}}" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label>Back Image Title</label>
                                                <input type="text"  name="back_title" required value="{{old('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_clone">
                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label>Image</label>
                                                    <input type="file"  name="image[]" required value="" class="form-control" />
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label> Image Alt</label>
                                                    <input type="text"  name="alt[]" required value="" 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="" 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().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