@extends('admin.layout.layout')

@section('page-level-css')
<link href="{{asset('admin/assets/css/filepond.css')}}" rel="stylesheet" type="text/css" media="screen">
<script src="{{asset('admin/assets/js/filepond.js')}}"></script>
@endsection

@section('content')
{{-- csrf token --}}
<meta name="csrf-token" content="{{ csrf_token() }}">
{{-- csrf token --}}
<!-- START PAGE-CONTAINER -->
<div class="page-container ">
  <!-- START HEADER -->
  @include('admin.partials.header')
  <!-- END HEADER -->
  <!-- START PAGE CONTENT WRAPPER -->
  <div class="page-content-wrapper ">
    <!-- START PAGE CONTENT -->
    <div class="content sm-gutter">
      <!-- START JUMBOTRON -->
      <div data-pages="parallax">
        <div class="container-fluid p-l-25 p-r-25 sm-p-l-0 sm-p-r-0">
          <div class="inner">
            <!-- START BREADCRUMB -->
            <ol class="breadcrumb sm-p-b-5">
              <li class="breadcrumb-item"><a href="#">Home</a></li>
              <li class="breadcrumb-item active">Create Product</li>
            </ol>
          </div>
        </div>
      </div>
      <!-- END JUMBOTRON -->
      <!-- START CONTAINER FLUID -->
      <div class="container-fluid container-fixed-lg">
        <!-- START ROW -->
        <div class="col-md-12">
          @if ($errors->any())
          <div class="alert alert-danger">
            <button class="close" data-dismiss="alert"></button>
            <ul>
              @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
              @endforeach
            </ul>
          </div>
          @endif
          @if(Session::has('success'))
          <div class="alert alert-success">
            <button class="close" data-dismiss="alert"></button>
            {{Session::get('success')}}
          </div>
          @endif
        </div>

        <div class="card card-default">
          <div class="card-header ">
            <div class="card-title">
              Create User Information
            </div>
            <div class="tools">
              <a href="javascript:;" class="collapse"></a>
              <a href="#grid-config" data-toggle="modal" class="config"></a>
              <a href="javascript:;" class="reload"></a>
              <a href="javascript:;" class="remove"></a>
            </div>
            {{-- current company image --}}
            {{-- <div class="row-xs-height pull-right">
                <div class="social-user-profile col-xs-height text-center col-top">
                  <div class="thumbnail-wrapper dcustom95 circular bordered b-white">
                    <img src="{{asset('storage/users/default_company.png')}}"
            data-src-retina="{{asset('storage/users/default_company.png')}}"
            data-src="{{asset('storage/users/default_company.png')}}">
          </div>
        </div>
        <p class="hint-text m-t-5 small">Current Company logo</p>
      </div> --}}
      {{-- current company image --}}
    </div>
    <div class="card-body">
      <form data-parsley-validate method="post" action="{{route('products.store')}}" enctype="multipart/form-data"
        id="createUserForm">
        @csrf
        <div class="card-title">
          <h4><strong>Product Information</strong></h4>
        </div>
        <hr>
        <div class="row">
          <div class="col-md-4">
            <p>Tilte</p>
            <div class="form-group form-group-default required">
              <input class="typeahead form-control sample-typehead" type="text" placeholder="Title"
                value="{{ old('title') }}" name="title" required="required">
            </div>
          </div>
          <div class="col-md-4">
            <p>SKU</p>
            <div class="form-group form-group-default required">
              <input class="typeahead form-control sample-typehead" type="text" placeholder="SKU"
                value="{{ old('sku') }}" name="sku" required="required">
            </div>
          </div>
          <div class="col-md-4">
            <p>Quantity</p>
            <div class="form-group form-group-default required">
              <input class="typeahead form-control sample-typehead" type="text" placeholder="Quantity"
                value="{{ old('quantity') }}" name="quantity" required="required">
            </div>
          </div>
          <div class="col-md-4">
            <p>Price</p>
            <div class="form-group form-group-default required">
              <input class="typeahead form-control sample-typehead allownumericwithoutdecimal" type="text"
                placeholder="Price" value="{{ old('price') }}" name="price" required="required">
            </div>
          </div>
          <div class="col-md-4">
            <p>Discount Price</p>
            <div class="form-group form-group-default">
              <input class="typeahead form-control sample-typehead" type="text" name="discount_price"
                placeholder="Discount Price" value="{{ old('discount_price') }}">
            </div>
          </div>
          <div class="col-md-4">
            <p>Size Text</p>
            <div class="form-group form-group-default">
              <input class="typeahead form-control sample-typehead" type="text" name="size_text" placeholder="Size Text"
                value="{{ old('size_text') }}">
            </div>
          </div>
          <div class="col-md-4">
            <p>Cover Text</p>
            <div class="form-group form-group-default">
              <input class="typeahead form-control sample-typehead" type="text" name="cover_text"
                placeholder="Cover Text" value="{{ old('cover_text') }}">
            </div>
          </div>

          {{-- new fields starts here --}}
          <div class="col-md-4">
            <p>Print/Pattern Type</p>
            <div class="form-group form-group-default">
              <input class="typeahead form-control sample-typehead" type="text" name="print_pattern_text"
                placeholder="Print/Pattern Type" value="{{ old('print_pattern_text') }}">
            </div>
          </div>

          <div class="col-md-4">
            <p>Brand</p>
            <div class="form-group form-group-default">
              <input class="typeahead form-control sample-typehead" type="text" name="brand"
                placeholder="Brand" value="{{ old('brand') }}">
            </div>
          </div>

          <div class="col-md-4">
            <p>Thread Count</p>
            <div class="form-group form-group-default">
              <input class="typeahead form-control sample-typehead" type="text" name="thread_count"
                placeholder="Thread Count" value="{{ old('thread_count') }}">
            </div>
          </div>
          {{-- new fields ends here --}}

          {{-- <div class="col-md-4">
                  <p>Images</p>
                  <div class="form-group form-group-default required">
                    <input type="file" class="form-control" name="images[]" multiple="multiple">
                  </div>
                </div> --}}
          <div class="col-md-12">
            <p>Images</p>
            <input type="file" class="filepond fileupload" name="images[]" multiple data-allow-reorder="true"
              data-max-file-size="3MB" data-max-files="6" />
          </div>

          <div class="col-md-12">
            <div class="form-group">
              <p>Description</p>
              <textarea class="typeahead form-control sample-typehead" type="text" name="description"
                placeholder="Description">{{ old('description') }}</textarea>
            </div>
          </div>

        </div>

        <div class="card-title">
          <h4><strong>Other Details</strong></h4>
        </div>
        <hr>
        <div class="row">
          <div class="col-md-4">
            <p>Is new</p>
            <div class="form-group">
              <select class="full-width" data-init-plugin="select2" name="is_new">
                <option value="1" @if(old('is_new')==1) selected="selected" @endif>Active</option>
                <option value="2" @if(old('is_new')==2) selected="selected" @endif>Inactive</option>
              </select>
            </div>
          </div>
          <div class="col-md-4">
            <p>Is in sale</p>
            <div class="form-group">
              <select class="full-width" data-init-plugin="select2" name="is_in_sale">
                <option value="1" @if(old('is_in_sale')==1) selected="selected" @endif>Active</option>
                <option value="2" @if(old('is_in_sale')==2) selected="selected" @endif>Inactive</option>
              </select>
            </div>
          </div>
          <div class="col-md-4">
            <p>Is in Week Sale</p>
            <div class="form-group">
              <select class="full-width" data-init-plugin="select2" name="is_in_week_sale">
                <option value="1" @if(old('is_in_week_sale')==1) selected="selected" @endif>Active</option>
                <option value="2" @if(old('is_in_week_sale')==2) selected="selected" @endif>Inactive</option>
              </select>
            </div>
          </div>
          <div class="col-md-4">
            <p>Is featured</p>
            <div class="form-group">
              <select class="full-width" data-init-plugin="select2" name="is_featured">
                <option value="1" @if(old('is_featured')==1) selected="selected" @endif>Active</option>
                <option value="2" @if(old('is_featured')==2) selected="selected" @endif>Inactive</option>
              </select>
            </div>
          </div>
          <div class="col-md-4">
            <p>Is Trending</p>
            <div class="form-group">
              <select class="full-width" data-init-plugin="select2" name="is_trending">
                <option value="1" @if(old('is_trending')==1) selected="selected" @endif>Active</option>
                <option value="2" @if(old('is_trending')==2) selected="selected" @endif>Inactive</option>
              </select>
            </div>
          </div>
        </div>

        <div class="card-title">
          <h4><strong>Super Admin Details</strong></h4>
        </div>
        <hr>
        <div class="row">
          <div class="col-md-4">
            <div class="form-group">
              <p>Category <span class="text-danger">*</span></p>
              <select class="full-width" data-init-plugin="select2" name="category_id" id="categories"
                required="required">
                @if(count($categories) != 0)
                <option value="">Select Category</option>
                @foreach( $categories as $category )
                <option value="{{$category->id}}" @if(old('category_id')) @if(old('category_id')==$category->id)
                  selected="selected"
                  @endif
                  @endif
                  >{{$category->category}}</option>
                @endforeach
                @endif
              </select>
            </div>
          </div>
          <div class="col-md-4">
            <div class="form-group">
              <p>Sub Category <span class="text-danger">*</span></p>
              <select @if(!old('state')) disabled="disabled" @endif class="full-width" data-init-plugin="select2"
                name="sub_category_id" id="subCategories" required="required">
                {{-- @if(count($states) != 0)
                              <option value = "">Select State</option>
                              @foreach( $states as $state )
                                  <option value="{{$state->id}}"
                @if(old('state'))
                @if(old('state') == $state->id)
                selected="selected"
                @endif
                @endif
                >{{$state->name}}</option>
                @endforeach
                @endif --}}
              </select>
            </div>
          </div>
          <div class="col-md-4">
            <div class="form-group">
              <p>Product Variants</p>
              <select @if(!old('product_variants')) disabled="disabled" @endif class="full-width pro-variants"
                data-init-plugin="select2" name="product_variants[]" id="product_variants" multiple>
                {{-- @if(count($states) != 0)
                              <option value = "">Select State</option>
                              @foreach( $states as $state )
                                  <option value="{{$state->id}}"
                @if(old('state'))
                @if(old('state') == $state->id)
                selected="selected"
                @endif
                @endif
                >{{$state->name}}</option>
                @endforeach
                @endif --}}
              </select>
            </div>
          </div>


          {{-- <div class="col-md-4">
                  <div class="form-group">
                    <p>Color <span class="text-danger">*</span></p>
                      <select class="full-width" data-init-plugin="select2" name="color_id" id="userCity" required="required">
                        @if(count($colors) != 0)
                            <option value>Select City</option>
                            @foreach( $colors as $color )
                              <option value="{{$color->id}}"
          @if(old('color_id'))
          @if(old('color_id') == $color->id)
          selected="selected"
          @endif
          @endif
          >{{$color->color}}</option>
          @endforeach
          @endif
          </select>
        </div>
    </div> --}}
    <div class="col-md-4">
      <div class="form-group">
        <p>Color</p>
        <select class="full-width" data-init-plugin="select2" name="color_id[]" multiple="multiple">
          <option value>Select Color</option>
          @if(count($colors) != 0)
          @foreach( $colors as $color )
          <option value="{{$color->id}}" @if(old('color_id')) @php $oldcolors=old('color_id'); @endphp @foreach(
            $oldcolors as $oldcolor ) @if($oldcolor==$color->id)
            selected="selected"
            @endif
            @endforeach
            @endif
            >{{$color->color}}</option>
          @endforeach
          @endif
        </select>
      </div>
    </div>
    <div class="col-md-4">
      <div class="form-group">
        <p>Discount</p>
        <select class="full-width" data-init-plugin="select2" name="discount_id">
          @if(count($discounts) != 0)

          @foreach( $discounts as $discount )
          <option value="{{$discount->id}}" @if(old('discount_id')) @if(old('discount_id')==$discount->id)
            selected="selected"
            @endif
            @endif
            >{{$discount->discount_percentage}}</option>
          @endforeach
          @endif
        </select>
      </div>
    </div>
    {{-- <div class="col-md-4">
                  <div class="form-group">
                    <p>Fabric</p>
                    <select class="full-width" data-init-plugin="select2" name="fabric_id" required="required">
                      @if(count($fabrics) != 0)

                          @foreach( $fabrics as $fabric )
                            <option value="{{$fabric->id}}"
    @if(old('fabric_id'))
    @if(old('fabric_id') == $fabric->id)
    selected="selected"
    @endif
    @endif
    >{{$fabric->fabric}}</option>
    @endforeach
    @endif
    </select>
  </div>
</div> --}}
<div class="col-md-4">
  <div class="form-group">
    <p>Fabric</p>
    <select class="full-width" data-init-plugin="select2" name="fabric_id[]" multiple="multiple">

      @if(count($fabrics) != 0)
      @foreach( $fabrics as $fabric )
      <option value="{{$fabric->id}}" @if(old('fabric_id')) @php $oldfabrics=old('fabric_id'); @endphp @foreach(
        $oldfabrics as $oldfabric ) @if($oldfabric==$fabric->id)
        selected="selected"
        @endif
        @endforeach
        @endif
        >{{$fabric->fabric}}</option>
      @endforeach
      @endif
    </select>
  </div>
</div>
{{-- <div class="col-md-4">
                  <div class="form-group">
                    <p>Sizes</p>
                    <select class="full-width" data-init-plugin="select2" name="size_id" required="required">
                      @if(count($sizes) != 0)

                          @foreach( $sizes as $size )
                            <option value="{{$size->id}}"
@if(old('size_id'))
@if(old('size_id') == $size->id)
selected="selected"
@endif
@endif
>{{$size->size}}</option>
@endforeach
@endif
</select>
</div>
</div> --}}
<div class="col-md-4">
  <div class="form-group">
    <p>Sizes</p>
    <select class="full-width" data-init-plugin="select2" name="size_id[]" multiple="multiple">
      @if(count($sizes) != 0)
      @foreach( $sizes as $size )
      <option value="{{$size->id}}" @if(old('size_id')) @php $oldSizes=old('size_id'); @endphp @foreach( $oldSizes as
        $oldSize ) @if($oldSize==$size->id)
        selected="selected"
        @endif
        @endforeach
        @endif
        >{{$size->size}}</option>
      @endforeach
      @endif
    </select>
  </div>
</div>

<div class="col-md-4">
  <div class="form-group">
    <p>Prices</p>
    <select class="full-width" data-init-plugin="select2" name="price_id" required="required">
      @if(count($prices) != 0)

      @foreach( $prices as $price )
      <option value="{{$price->id}}" @if(old('price_id')) @if(old('price_id')==$price->id)
        selected="selected"
        @endif
        @endif
        >{{$price->lower_price}} - {{$price->higher_price}}</option>
      @endforeach
      @endif
    </select>
  </div>
</div>
<div class="col-md-4">
  <div class="form-group">
    <p>Product Tags</p>
    <select class="full-width" data-init-plugin="select2" name="tags[]" multiple="multiple">
      @if(count($tags) != 0)
      @foreach( $tags as $tag )
      <option value="{{$tag->id}}" @if(old('tags')) @php $oldFVCS=old('tags'); @endphp @foreach( $oldFVCS as $oldTag )
        @if($oldTag==$tag->id)
        selected="selected"
        @endif
        @endforeach
        @endif
        >{{$tag->tag}}</option>
      @endforeach
      @endif
    </select>
  </div>
</div>

<div class="col-md-4">
  <p>Group Product Offer</p>
  <div class="form-group">
    <select class="full-width" data-init-plugin="select2" name="has_offer_products">
      <option value="1" @if(old('has_offer_products')==1) selected="selected" @endif>Active</option>
      <option value="2" @if(old('has_offer_products')==2) selected="selected" @endif>Inactive</option>
    </select>
  </div>
</div>
<div class="col-md-4">
  <div class="form-group">
    <p>Products in Offer</p>
    <select @if(!old('product_offers'))  @endif class="full-width pro-variants" data-init-plugin="select2" name="product_offers[]" id="product_offers" multiple>
      @if(count($products) != 0)
          @foreach( $products as $product )
              @php
                if(!empty($product->images)){
                  $images = (json_decode($product->images, true));
                  if(isset($images[0]['url'])){
                    $imageToDisplay = $images[0]['url'];
                  }else{
                    $imageToDisplay = null;
                  }
                }else{
                  $images =  null;
                  $imageToDisplay = null;
                }
              @endphp
              <option value="{{$product->id}}" data-image="{{ $imageToDisplay }}"
                @if(old('product_offers'))
                  @if(old('product_offers') == $product->id)
                  selected="selected"
                  @endif
                @endif
              >
                {{$product->title}}
              </option>
          @endforeach
      @endif
    </select>
  </div>
</div>

<div class="col-md-4">
  <p>Group Product Quantity</p>
  <div class="form-group form-group-default">
    <input class="typeahead form-control sample-typehead" type="text" name="offer_product_quantity" placeholder="Group Product Quantity"
      value="{{ old('offer_product_quantity') }}">
  </div>
</div>

<div class="col-md-6">
  <div class="form-group">
    <p>Products in Upsell</p>
    <select @if(!old('upselling_products'))  @endif class="full-width pro-variants" data-init-plugin="select2" name="upselling_products[]" id="upselling_products" multiple>
      @if(count($products) != 0)
          @foreach( $products as $product )
              @php
                if(!empty($product->images)){
                  $images = (json_decode($product->images, true));
                  if(isset($images[0]['url'])){
                    $imageToDisplay = $images[0]['url'];
                  }else{
                    $imageToDisplay = null;
                  }
                }else{
                  $images =  null;
                  $imageToDisplay = null;
                }
              @endphp
              <option value="{{$product->id}}" data-image="{{ $imageToDisplay }}"
                @if(old('upselling_products'))
                  @if(old('upselling_products') == $product->id)
                  selected="selected"
                  @endif
                @endif
              >
                {{$product->title}}
              </option>
          @endforeach
      @endif
    </select>
  </div>
</div>

<div class="col-md-6">
  <div class="form-group">
    <p>Products in Cross Sell</p>
    <select @if(!old('cross_selling_product_id'))  @endif class="full-width pro-variants" data-init-plugin="select2" name="cross_selling_product_id[]" id="cross_selling_product_id" multiple>
      @if(count($products) != 0)
          @foreach( $products as $product )
              @php
                if(!empty($product->images)){
                  $images = (json_decode($product->images, true));
                  if(isset($images[0]['url'])){
                    $imageToDisplay = $images[0]['url'];
                  }else{
                    $imageToDisplay = null;
                  }
                }else{
                  $images =  null;
                  $imageToDisplay = null;
                }
              @endphp
              <option value="{{$product->id}}" data-image="{{ $imageToDisplay }}"
                @if(old('cross_selling_product_id'))
                  @if(old('cross_selling_product_id') == $product->id)
                  selected="selected"
                  @endif
                @endif
              >
                {{$product->title}}
              </option>
          @endforeach
      @endif
    </select>
  </div>
</div>

<div class="col-md-4">
  <div class="form-group">
    <p>Collection</p>
    <select class="full-width" data-init-plugin="select2" name="collections[]" multiple="multiple">
      @if(count($collections) != 0)
      @foreach( $collections as $collection )
      <option value="{{$collection->id}}" @if(old('collections')) @php $oldCollection=old('collections'); @endphp
        @foreach( $oldCollection as $oldCollection ) @if($oldCollection==$collection->id)
        selected="selected"
        @endif
        @endforeach
        @endif
        >{{$collection->collection}}</option>
      @endforeach
      @endif
    </select>
  </div>
</div>
<div class="col-md-12">
  <div class="card-title">
    <h4><strong>Sizes</strong></h4>
  </div>
  <hr>

  {{-- sizes new --}}
  <button class="btn btn-primary add_field_button">Add Sizes</button>
  {{-- sizes new --}}
  <div class="input_fields_wrap">
    <div class="col-md-6">
      <p>Size</p>
      <input type="text" class="typeahead form-control sample-typehead" name="sizes[]" value="">
    </div>
    <div class="col-md-6">
      <p>SKU</p>
      <input type="text" class="typeahead form-control sample-typehead" name="skus[]" value="">
    </div>
    <div class="col-md-6">
      <p>Price</p>
      <input type="text" class="typeahead form-control sample-typehead" name="prices[]" value="">
    </div>
    <div class="col-md-6">
      <p>Discount Price</p>
      <input type="text" class="typeahead form-control sample-typehead" name="discountprices[]" value="">
    </div>
    <div class="col-md-6">
      <p>Stock</p>
      <input type="text" class="typeahead form-control sample-typehead" name="stocks[]" value="">
    </div>
    {{-- <a href="#" class="btn btn-danger remove_field" data-image-key="{{$key}}" data-content-id =
    "{{$data->id}}">Remove</a> --}}
  </div>
</div>

<div class="card-title">
  <h4><strong>SEO</strong></h4>
</div>
<hr>
<div class="col-md-4">
  <p>Meta Title</p>
  <div class="form-group form-group-default  txtOnly">
    <input class="typeahead form-control sample-typehead" type="text" placeholder="Meta Title"
      value="{{ old('meta_title') }}" name="meta_title">
  </div>
</div>

<div class="col-md-12">
  <p>Meta Description</p>
  <div class="form-group form-group-default  txtOnly">
    <input class="typeahead form-control sample-typehead" type="text" placeholder="Meta Description"
      value="{{ old('meta_description') }}" name="meta_description">
  </div>
</div>

<div class="col-md-12">
  <p>Key Words</p>
  <div class="form-group form-group-default  txtOnly">
    <input class="typeahead form-control sample-typehead" type="text" placeholder="Key Words"
      value="{{ old('keywords') }}" name="keywords">
  </div>
</div>

</div>

<div class="card-title">
  <h4><strong>Status</strong></h4>
</div>
<hr>
<div class="row">
  <div class="col-md-4">
    <div class="form-group">
      <select class="full-width" data-init-plugin="select2" name="status">
        <option value="1" @if(old('status')==1) selected="selected" @endif>Active</option>
        <option value="2" @if(old('status')==2) selected="selected" @endif>Inactive</option>
      </select>
    </div>
  </div>
  <div class="col-md-8">
    <button class="btn btn-success pull-right" type="submit">Create a product</button>
  </div>
</div>
</form>
</div>
</div>
<!-- END ROW -->
</div>
<!-- END CONTAINER FLUID -->
</div>
<!-- END PAGE CONTENT -->
@include('admin.partials.footer')
<!-- END COPYRIGHT -->
</div>
<!-- END PAGE CONTENT WRAPPER -->
</div>
<!-- END PAGE CONTAINER -->
@endsection

@section('page-level-js')
<script type="text/javascript">
  $(document).on('change', '#categories', function(event) {
        var categoryId = $(this).val();
        $.ajax({
                url: "{{route('subcategories.get')}}",
                type: "get",
                data: {'categoryId' : categoryId},
                success: function(response) {
                    console.log(response);
                    var output = JSON.parse(response);
                    $('#subCategories').removeAttr('disabled');
                    $('#subCategories').html(output);
                }
            })
    });
    $(document).on('change', '#subCategories', function(event) {
        var subCategoryId = $(this).val();
        $.ajax({
                url: "{{route('productvariants.get')}}",
                type: "get",
                data: {'subCategoryId' : subCategoryId},
                success: function(response) {
                    // console.log(response);
                    var output = JSON.parse(response);
                    $('#product_variants').removeAttr('disabled');
                    $('#product_variants').html(output);
                }
            })
    });
    $(".pro-variants").select2({
    templateResult: formatState,
    templateSelection: formatState
    });

    function formatState (opt) {
        if (!opt.id) {
            return opt.text.toUpperCase();
        }

        var optimage = $(opt.element).attr('data-image');
        console.log(optimage)
        if(!optimage){
          return opt.text.toUpperCase();
        } else {
            var $opt = $(
              '<span><img src="' + optimage + '" width="60px" /> ' + opt.text.toUpperCase() + '</span>'
            );
            return $opt;
        }
    };
</script>

<script>
  /*
    We want to preview images, so we need to register the Image Preview plugin
    */
    FilePond.registerPlugin(

      // encodes the file as base64 data
      FilePondPluginFileEncode,

      // validates the size of the file
      FilePondPluginFileValidateSize,

      // corrects mobile image orientation
      FilePondPluginImageExifOrientation,

      // previews dropped images
      FilePondPluginImagePreview
    );

    // Select the file input and use create() to turn it into a pond
    FilePond.create(
      document.querySelector('input.fileupload'),{
        allowFileEncode: true
      }
    );

  $(document).ready(function() {
	var max_fields      = 10; //maximum input boxes allowed
	var wrapper   		= $(".input_fields_wrap"); //Fields wrapper
	var add_button      = $(".add_field_button"); //Add button ID

	var x = 1; //initlal text box count
	$(add_button).click(function(e){ //on add input button click
		e.preventDefault();
		if(x < max_fields){ //max input box allowed
			x++; //text box increment
			$(wrapper).append('<div class="col-md-6"><h5>Size Data</h5><hr><p>Size</p><input type="text" class="typeahead form-control sample-typehead" name="sizes[]" value=""><p>SKU</p><input type="text" class="typeahead form-control sample-typehead" name="skus[]" value=""><p>Price</p>  <input type="text" class="typeahead form-control sample-typehead" name="prices[]" value=""><p>Discount Price</p><input type="text" class="typeahead form-control sample-typehead" name="discountprices[]" value=""><p>Stock</p><input type="text" class="typeahead form-control sample-typehead" name="stocks[]" value=""><a href="#" class="btn btn-danger remove_deal_field">Remove</a></div>');
		}
	});

  $(wrapper).on("click",".remove_deal_field", function(e){ //user click on remove text
  e.preventDefault(); $(this).parent('div').remove(); x--;

  });

});

</script>

@endsection