@extends('web.layout.master')

@section('content')
<style>


    @media (max-width: 766px) {

        .contPayBtnMobile{
            display: block !important;
        }
        .contPayBtnDesktop{
            display: none !important;
        }

        .shippingOptionMobile{
            display: block !important;
        }
        .shippingOptionDesktop{
            display: none !important;
        }

        .custom-container{
            padding: 0px !important;
            margin-top: 3px !important;
        }
        .card-none-border{
            border-radius: 0px !important;
            border: 0px;
        }
        .shipaddre{
            margin-bottom: 5px !important;
        }

        .shipaddre-body{
            margin-bottom: 20px !important;
        }
    }

    #app {
        background: #f1f1f1;
        min-height: 600px;
    }

    .btn-success {
        background: #409b5e;
        border: 0px;
    }
    .shippingFormRow>*{
        padding: 10px;
    }
    input,select{
        border:1.2px solid #3A3A3A !important;
        margin-top: 5px;
        height: 38px;
     }
     .btn-primary {
        background: #04458f;
        border: 0px;
    }
    .contPayBtnMobile{
        display: none;
    }
    .contPayBtnDesktop{
        display: initial;
    }

    .shippingOptionMobile{
        display: none;
    }
    .shippingOptionDesktop{
        display: initial;
    }
    .shipaddre{
        border-radius: 10px 10px 0px 0px;
        border-bottom: 0px;
    }
    .shipaddre-body{
        padding-bottom: 0px !important;
        margin-bottom: 5px;
    }
    .custshipadd{
        margin-top: 0px;
        border-radius: 0px 0px 10px 10px;
        border-top: 0px;
    }
    .custshipadd-body{
        padding-top: 0px !important;
    }

    .radio-main .custom-radio01 input{
        top: 10px !important;
    }

    .form-control.is-invalid{
        border-color: #dc3545 !important;
    }

    input#password {
        height: auto !important;
    }
    input#email {
        height: auto !important;
    }

    .valid{

    position: absolute;
    top: 70%;
    transform: translateY(-50%);
    right: 15px;
    color: #409b5e;

    }
    .form-group{
        position: relative;
    }


 /* Dotted red border */
 .hrdash {
    margin-top: 5px;
    margin-bottom: 5px;
    border: none;
  height: 1px;
  background: #000;
  background: repeating-linear-gradient(90deg,#000,#000 6px,transparent 6px,transparent 12px);
  }
</style>

@include('web.checkout-header-v2')

<div class="container mt-4 mb-2 custom-container">
    <div class="row">
        <div class="col-md-8">
            <div class="card card-none-border shippingaddressdiv">
                <div class="card-body p-3">
                    @if(!auth()->check())
                    <div class="card card-body p-3 border-0" style="background: #f8f8f9">
                        <div class="row">
                            <div class="col-8 col-md-10">
                                <span style="font-size: 18px;font-weight: 600;" class="d-lg-none">Already have an Account?</span>
                                <span style="font-size: 18px;font-weight: 600;" class="d-none d-lg-block">Already have an Account?</span>
                                <p style="color:#797979;" class="m-0">Sign in chekout faster</p>
                            </div>
                            <div class="col-4 col-md-2 text-end m-auto">
                                <button type="button" onclick="loginModel()" class="btn btn-success d-lg-none">Sign In</button>
                                <button type="button" class="btn btn-success d-none d-lg-block" onclick="loginModel()" style="width: 95%;">Sign In</button>
                            </div>
                        </div>

                    </div>
                    @endif
                    <form action="{{ route('checkout-shipping-v2') }}" id="shippingForm" method="post">
                        @csrf
                        <input type="hidden" name="subtotal" id="subtotaltxt" value="">
                        <input type="hidden" name="ShippingCharges" id="ShippingChargestxt" value="">

                        <input type="hidden" name="total" id="totaltxt" value="">
                        <input type="hidden" name="discountPrice" id="discountPricetxt" value="">
                        <input type="hidden" name="couponDiscount" id="couponDiscounttxt" value="">
                        <input type="hidden" name="couponCode" id="couponCodetxt" value="">

                    <div class="row mt-3">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="shippingemail">Email</label>
                                <input type="email" class="form-control" id="shippingemail" value="{{ (!empty(\Session::get('shippingemail')) ? \Session::get('shippingemail') : '') }}" name="shippingemail" aria-describedby="shippingemail"
                                    placeholder="email@domain.com">
                            </div>
                        </div>
                    </div>



                    <div class="mt-3">
                        <h5 class="m-0 font-weight-600"> Shipping Address</h5>
                    </div>

                        <div class="row shippingFormRow">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="shippingcountry">Country</label>
                                    <select name="shippingcountry" id="shippingcountry" class="form-control"
                                        aria-describedby="shippingcountry" onChange="getCountryWiseState(this.value)">
                                        @foreach ($countries as $c)
                                            @if(!empty(\Session::get('shippingcountry')) && (\Session::get('shippingcountry') == $c->name))
                                                <option data-id="{{ $c->id }}" data-shortname="{{ $c->shortname }}" value="{{ $c->name }}" selected>{{ $c->name }}</option>
                                            @else
                                               <option data-id="{{ $c->id }}" data-shortname="{{ $c->shortname }}" value="{{ $c->name }}">{{ $c->name }}</option>
                                            @endif

                                        @endforeach
                                    </select>
                                    <span id="shippingcountry-error" class="error valid"><i class="fa fa-check"></i></span>
                                </div>
                            </div>
                            <div class="col-md-6 d-none d-lg-block">
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="shippingfirstname">First Name</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingfirstname')) ? \Session::get('shippingfirstname') : '') }}" name="shippingfirstname" id="shippingfirstname"
                                        aria-describedby="shippingfirstname" placeholder="">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="shippinglastname">Last Name</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippinglastname')) ? \Session::get('shippinglastname') : '') }}" name="shippinglastname" id="shippinglastname"
                                        aria-describedby="shippinglastname" placeholder="">
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="shippingcompany">Company</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingcompany')) ? \Session::get('shippingcompany') : '') }}" name="shippingcompany" id="shippingcompany"
                                        aria-describedby="shippingcompany" placeholder="">
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="shippingstreetadress">Street Address</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingstreetadress')) ? \Session::get('shippingstreetadress') : '') }}" name="shippingstreetadress" id="shippingstreetadress"
                                        aria-describedby="shippingstreetadress" placeholder="">
                                </div>

                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="shippingstreetadress2">Apt/Unit#</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingstreetadress2')) ? \Session::get('shippingstreetadress2') : '') }}" name="shippingstreetadress2" id="shippingstreetadress2"
                                        aria-describedby="shippingstreetadress2" placeholder="">
                                </div>
                                <div class="form-check m-1">
                                    <input type="checkbox" name="po_box" class="form-check-input" id="po_box">
                                    <label class="form-check-label" for="po_box">PO BOX</label>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="shippingcity">City</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingcity')) ? \Session::get('shippingcity') : '') }}" name="shippingcity" id="shippingcity"
                                        aria-describedby="shippingcity" placeholder="">
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="shippingstate">State/Region</label>
                                    <select name="shippingstate" id="shippingstate" class="form-control"
                                        aria-describedby="shippingstate">
                                        <option value="" selected>State/Region</option>
                                    </select>

                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="shippingzipcode">Zip/Postal Code</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingzipcode')) ? \Session::get('shippingzipcode') : '') }}" name="shippingzipcode" id="shippingzipcode"
                                        aria-describedby="shippingzipcode" placeholder="">
                                </div>
                                <span style="color: red;display: none;" id="shippingzipcodeerror">Invalid Zip Code</span>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="shippingphone">Phone Number</label>
                                    <input type="text" class="form-control" value="{{ (!empty(\Session::get('shippingphone')) ? \Session::get('shippingphone') : '') }}" name="shippingphone" id="shippingphone"
                                        aria-describedby="shippingphone" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="row mt-4">
                            <div class="col-12 text-center">
                                <button type="submit" type="button" class="btn btn-success shippingOptionMobile shippingOptionBtn" style="width: 100%;font-size: 18px;padding: 10px;">View Shipping Options</button>
                                <button type="submit" type="button" class="btn btn-primary shippingOptionDesktop shippingOptionBtn" style="width: 17rem;font-size: 18px;padding: 10px;">View Shipping Options</button>

                            </div>
                            <div class="col-12 text-center mt-3">

                                <a href="{{ route('home') }}" class="text-danger">Continue Shopping</a>
                            </div>

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

        </div>


        <div class="col-md-4 ">

            <div class="card d-none d-lg-block">
                <div class="card-body p-2 d-none d-lg-block">
                    <div class="row" onclick="collapseContent()">
                        <div class="col-7">
                            <label class="fs-55"  >Have a Promo Code? </label>
                        </div>
                        <div class="col-5 text-end">
                            <i class="fas fa-chevron-down faicon"></i>
                        </div>

                    </div>
                    <div class="collapse mt-3" id="collapsePromoCode">
                        <div class="row">
                            <div class="col-9">
                                <div class="form-group">
                                    <input type="text" name="coupon_code" value="{{ (!empty(\Session::get('couponCode')) ? \Session::get('couponCode') : '') }}" class="form-control" id="coupon_code" aria-describedby="coupon_code" placeholder="PROMO CODE" style="height: 50px;">
                                    @if(!empty(\Session::get('couponCode')))
                                        <span id="couponError" class="text-success">Coupon code applied.</span>&nbsp;&nbsp;<a href="#" onclick="removeCouponCode()" id="removeCouponCode">Remove</a>
                                    @else
                                        <span id="couponError" style="display: none"></span>&nbsp;&nbsp;<a href="#" onclick="removeCouponCode()" id="removeCouponCode" style="display: none">Remove</a>
                                    @endif
                                </div>
                            </div>
                            <div class="col-3 p-1" style="">
                                <button type="button" class="btn btn-primary btn-lg" onclick="applyCouponCode()">APPLY</button>
                            </div>
                        </div>
                    </div>
                </div>
                <hr class="d-lg-none" style="border: 2.5px solid #ddd;margin-top: 5px;margin-bottom: 0px;">

                <hr class="hrdash d-none d-lg-block">
                <div class="card-body">
                    <div class="row mb-2">
                        <div class="col-6 fs-6">
                            <b>Subtotal</b>
                        </div>
                        <div class="col-6 fs-6 text-end">
                            <b id="subtotal">$22.00</b>
                        </div>
                    </div>
                    <div class="row mb-2 discountPriceDiv" @if(!empty(session()->get('discountPrice')) && session()->get('discountPrice') <= 0) style="display: none" @endif>
                        <div class="col-7 fs-6 text-success">
                            <b>Discount <span id="couponDiscountDiv">({{ session()->get('couponCode') }})</span></b>
                        </div>
                        <div class="col-5 fs-6 text-end">
                            <b class="discountPrice text-success">- ${{ (!empty(session()->get('discountPrice')) ? str_replace(',','',(session()->get('discountPrice'))) : "") }}</b>
                        </div>
                    </div>

                    <div class="row mb-2">
                        <div class="col-6 fs-6">
                            <b>Estimated Shipping</b>
                        </div>
                        <div class="col-6 fs-6 text-end">
                            <b id="shippingEstPrice">$9.98</b>
                        </div>
                    </div>
                    <div class="row mb-2">
                        <div class="col-6 fs-6">
                            <b>Estimated Tax</b>
                        </div>
                        <div class="col-6 text-end">
                            <b id="taxEst"><span style="color: #7d7d7d;">Calculated In Checkout</span></b>
                        </div>
                    </div>
                    <hr class="d-none d-lg-block">
                    <hr class="hrdash mt-4 mb-4 d-lg-none">
                    <div class="row mb-2">
                        <div class="col-6 fs-6">
                            <b>Order Total</b>
                        </div>
                        <div class="col-6 fs-6 text-end">
                            <b id="total">$31.98</b>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <a href="{{ route('checkout') }}" type="button" class="btn btn-secondary btn-lg w-100 mb-4 mt-2 disabled" aria-label="Proceed to Checkout">Place Order</a>
                        </div>
                    </div>

                </div>
            </div>

            <div class="card mt-2 mb-2">
                <div class="card-body pb-0">
                    <div class="row">
                        <div class="col-12 fs-6">
                            <p>Cart ID # {{ (!empty(\Cookie::get('cart')) ? \Cookie::get('cart') : "") }}</p>
                        </div>
                        <hr>
                        <div class="col-12 fs-6">
                            <p>Having trouble? Contact us! <a href="tel:866.243.2721" class="text-decoration-none">866.243.2721</a> </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD49-9cDFYapIud25ZR0bqw8My06CM3zQg&libraries=places&v=weekly" defer></script>

<script>






    $('#shippingzipcode').keyup(function () {
        $('#shippingzipcodeerror').hide();

    });



    $(document)
    .ajaxStart(function () {
      $('#qtyloader').show();
    })
    .ajaxStop(function () {
      $('#qtyloader').hide();
    });

    var ispaysstatetax =  "{{ (auth()->check()) ? auth()->user()->paysstatetax : '' }}";
      $.session.set("ispaysstatetax",ispaysstatetax);
                                        
                                        
    function collapseContent(){
        $('#collapsePromoCode').collapse('toggle');
    }
    $('#collapsePromoCode').on('shown.bs.collapse', function () {
            $('.faicon').addClass('rotate');
            $('.showorderlabel').text('Hide order summary');
     });

     $('#collapsePromoCode').on('hidden.bs.collapse', function () {
        $('.faicon').removeClass('rotate');
        $('.showorderlabel').text('Show order summary');
     });

     $(document).ready(function() {
       @if (Session::has('alert-danger'))

           $('#shippingzipcode').focus();
           $('#shippingzipcodeerror').show();

        @endif
        $('#collapsePromoCode').collapse('toggle');
            setTimeout(function() {
                $(".alert").hide();
            }, 5000);
    });

    $('.form-group input').each(function(){
        $(this).bind("change", function() {
            $(this).valid();
            $('#shippingemail').valid();
        });

    });
    $("#shippingcountry").on("select2:close", function (e) {
        $(this).valid();


    });
    $("#shippingstate").on("change", function (e) {
        $(this).valid();


    });

//    $('#shippingemail,#shippingfirstname,#shippinglastname,#shippingphone').blur(function(){
//        $('#qtyloader').hide();
//        addAbandonedCart();
//      });
    //   function paypalBtnClick(){
    //     $('.paypal-button-number-0').trigger('click');
    //   }

      function addAbandonedCart(){
        var firstname = $('#shippingfirstname').val();
        var lastname = $('#shippinglastname').val();
        var email = $("#shippingemail").val();
        var phone = $("#shippingphone").val();
        var companyName = $("#shippingcompany").val();
        $('#qtyloader').hide();
        $.ajax({
            type: 'post',
            url: "{{ route('add-abandoned-cart') }}",
            global: false,
            data: { "_token": '{{ csrf_token() }}','firstname':firstname,'lastname':lastname,'email':email,'phone':phone},
            dataType: "json",
            success: function(responce) {
                //alert('success');
                $('#qtyloader').hide();
            }
        });
      }

//    $('#shippingForm').on('blur keyup change', 'input', function(event) {
//        validateForm('#shippingForm');
//      });

      function validateForm(id) {
        var valid = $(id).validate().checkForm();

//          if (valid) {
//            $('.shippingOptionBtn').prop('disabled', false);
//              $('.shippingOptionBtn').removeClass('isDisabled');
//          } else {
//            $('.shippingOptionBtn').prop('disabled', 'disabled');
//            $('.shippingOptionBtn').addClass('isDisabled');
//          }
      }
      var iscouponinvalid = 0;
    $(document).ready(function() {

        $('#shippingphone').inputmask("(999) 999-9999",{ "clearIncomplete": true});
        $('#subtotal').text('$' + $.session.get("subtotal"));
        $('#shippingEstPrice').text('$' + $.session.get("shippingEstPrice"));
       // $('#taxEst').text('$' + $.session.get("taxEst"));
        $('#total').text('$' + $.session.get("total"));
      if($.session.get("discountPrice")){
       discountPrice = $.session.get("discountPrice");
      }else{
         discountPrice = 0;
    }
       
        if(discountPrice > 0){
            $('.discountPriceDiv').show();
            $('.discountPrice').text('- $'+discountPrice);
            $.session.set("couponCode",$('#coupon_code').val());
        }else{
          $.session.set("couponCode",'');
          if(iscouponinvalid == 0){
            $('#couponError').hide();
        }
          $('#removeCouponCode').hide();
          $('#coupon_code').val('');
          $('#coupon_code_new').val('');
          $('.discountPriceDiv').hide();
        }




        $("#shippingcountry").select2({
            placeholder: "Select a country"
        });
        $('#shippingcountry').val('United States').change();

        $('#subtotaltxt').val($.session.get("subtotal"));
        $('#ShippingChargestxt').val($.session.get("shippingEstPrice"));

        $('#totaltxt').val($.session.get("total"));
        $('#discountPricetxt').val(discountPrice);
        $('#couponCodetxt').val($.session.get("couponCode"));
        $('#couponDiscounttxt').val($.session.get("couponDiscount"));

        $('#shippingForm').validate({
            rules: {
                shippingemail: {
                    required: true
                },
                shippingcountry: {
                    required: true
                },
                shippingfirstname: {
                    required: true
                },
                shippinglastname: {
                    required: true
                },
                shippingstreetadress: {
                    required: true
                },
                shippingcity: {
                    required: true
                },
                shippingstate: {
                    required: true
                },
                shippingzipcode: {
                    required: true
                },
                shippingphone: {
                    required: true
                }
            },
            messages: {
                shippingemail: {
                    required: "Please enter email"
                },
                shippingcountry: {
                    required: "Please select country"
                },
                shippingfirstname: {
                    required: "Please enter first name"
                },
                shippinglastname: {
                    required: "Please enter last name"
                },
                shippingstreetadress: {
                    required: "Please enter street adress"
                },
                shippingcity: {
                    required: "Please enter city"
                },
                shippingstate: {
                    required: "Please enter state"
                },
                shippingzipcode: {
                    required: "Please enter zipcode"
                },
                shippingphone: {
                    required: "Please enter phone"
                }
            },
            success: function(label,element) {
                label.addClass("valid");
                label.append("<i class='fa fa-check'></i>");

              },
            errorElement: 'span',
            errorPlacement: function (error, element) {
                $(element).parents('.form-group').append(error)
            },
            highlight: function (element, errorClass, validClass) {
                $(element).addClass('is-invalid');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
            },
            submitHandler: function (form) {
               // $('#qtyloader').attr('data-wordLoad','Loading shipping options');
               // $('#qtyloader').show();
                form.submit();
            }
        });

        @if(!empty(\Session::get('shippingstreetadress')))
            $("#shippingForm").validate().form();
        @endif

    });

    function getCountryWiseState(val,state="") {

        @if(\Session::get('shippingstate'))
        if(state == ""){
            state = "{{ \Session::get('shippingstate') }}";
            }
        @endif
        var country_name = val;
        if(country_name == "United States"){
             initAutocomplete();
         }else{
             disableGoogleAutocomplete();
         }

        $.ajax({
                headers: {
                    'X-CSRF-TOKEN': "{{ csrf_token() }}"
                },
                url: "{{ route('shipping-countrywise-state') }}",
                dataType: "json",
                type: "GET",
                data: {
                    'Country_name': country_name
                },

                success: function(data) {
                    $('#shippingstate').html('');
                    $('#shippingstate').append($("<option selected value=''>State/Region</option>"));

                    var sflag = 0;
                    $.each(data, function(key, value) {
                            if(state == value.state_code){
                                sflag = 1;
                            }

                            if((country_name == "United States") || (country_name == "Canada")){
                                if(state == value.state_code){
                                    $('#shippingstate').append('<option value="'+ value.state_code +'" selected>'+ value.name +'</option>');
                                }else{
                                    $('#shippingstate').append('<option value="'+ value.state_code +'">'+ value.name +'</option>');
                                }

                            }else{
                                if(state == value.state_code){
                                    $('#shippingstate').append('<option value="'+ value.name +'" selected>'+ value.name +'</option>');
                                }else{
                                    $('#shippingstate').append('<option value="'+ value.name +'">'+ value.name +'</option>');
                                }

                            }

                    });
                    if(state){
                        $('#shippingstate').valid();
                        validateForm('#shippingForm');
                    }


                },
            });
    }

    let autocomplete;
    let address1Field;
    let address2Field;
    let postalField;
    var autocompleteListener;

    function initAutocomplete() {



        address1Field = document.querySelector("#shippingstreetadress");
        address2Field = document.querySelector("#shippingstreetadress");
        postalField = document.querySelector("#shippingzipcode");

        // Create the autocomplete object, restricting the search predictions to
        // addresses in the US and Canada.

            autocomplete = new google.maps.places.Autocomplete(address1Field, {
                componentRestrictions: { country: ["us"] },
                fields: ["address_components", "geometry"],
                types: ["address"],
              });



        // When the user selects an address from the drop-down, populate the
        // address fields in the form.
        autocompleteListener = google.maps.event.addListener(autocomplete,"place_changed", fillInAddress);


}

function disableGoogleAutocomplete() {
    if (autocomplete !== undefined) {
            google.maps.event.removeListener(autocompleteListener);
            google.maps.event.clearInstanceListeners(autocomplete);
            $(".pac-container").remove();

            console.log('disable autocomplete to GOOGLE');
     }
}


function fillInAddress() {

    // Get the place details from the autocomplete object.
    const place = autocomplete.getPlace();
    let address1 = "";
    let address2 = "";
    let postcode = "";
    let state = "";
    let country = "";

    // Get each component of the address from the place details,
    // and then fill-in the corresponding field on the form.
    // place.address_components are google.maps.GeocoderAddressComponent objects
    // which are documented at http://goo.gle/3l5i5Mr

    for (const component of place.address_components) {

      // @ts-ignore remove once typings fixed
      const componentType = component.types[0];

      switch (componentType) {
        case "street_number": {
          address2 = component.long_name;
          break;
        }

        case "route": {
          address1 = component.short_name;
          break;
        }

        case "postal_code": {
          postcode = `${component.long_name}${postcode}`;
          break;
        }

        case "postal_code_suffix": {
          postcode = `${postcode}-${component.long_name}`;
          break;
        }
        case "sublocality_level_1":
          document.querySelector("#shippingcity").value = component.long_name;
          break;
        case "locality":
          document.querySelector("#shippingcity").value = component.long_name;
          break;
        case "administrative_area_level_1": {
          state = component.short_name;

          break;
        }
        case "country":
          country = component.long_name;
       //   $('#shippingcountry').val(component.long_name).change();

         // document.querySelector("#country").value = component.long_name;
          break;
      }
    }
    $('#shippingzipcodeerror').hide();
    getCountryWiseState(country,state);

    $('#shippingstreetadress').val(address2 + ' ' + address1);
   // $('#street_app_unit').val();

    postalField.value = postcode;

    if($('#shippingstreetadress').val() != ""){
        $("#shippingcity").valid();
        $("#shippingzipcode").valid();
    }

  }
  var ShippingTax = 0;
  var subtotal = $.session.get("subtotal");
  var affectAmount = 0;
  var ShippingCharges = $.session.get("shippingEstPrice");
  var ShippingSurcharges = '{{ !empty(session()->get("ShippingSurcharges")) ? session()->get("ShippingSurcharges") : 0  }}';
  var discountPrice = $.session.get("discountPrice");
  function totalcal(){

     if($.session.get("discountPrice")){
        var discountPrice = $.session.get("discountPrice");
      }else{
          var discountPrice = 0;
        }
    

      var total = subtotal - discountPrice;

      if(discountPrice > 0){
        $('.discountPriceDiv').show();
        $('.discountPrice').text('- $'+discountPrice);
        $.session.set("couponCode",$('#coupon_code').val());
    }else{
      $.session.set("couponCode",'');
      if(iscouponinvalid == 0){
        $('#couponError').hide();
    }
      $('#removeCouponCode').hide();
      $('#coupon_code').val('');
      $('#coupon_code_new').val('');
      $('.discountPriceDiv').hide();
    }
      total = parseFloat(total)+parseFloat(ShippingCharges)+parseFloat(ShippingSurcharges)+parseFloat(ShippingTax);
      if(ShippingSurcharges > 0){
          $('#surchageShippingrright').text('( +$' + parseFloat(ShippingSurcharges).toFixed(2) +' surcharge)');
      }


      $('#shippingEstPrice').text('$'+(parseFloat(ShippingCharges)+parseFloat(ShippingSurcharges)).toFixed(2));

      $('#total').text('$'+parseFloat(total).toFixed(2));

      $.session.set("shipping-option-value", $('.shipping-option:checked').next('label').clone().children().remove().end().text());


      discountPrice = $.session.get("discountPrice");

            $.session.set("subtotal",parseFloat(subtotal).toFixed(2));
      $.session.set("shippingEstPrice",parseFloat(ShippingCharges).toFixed(2));
      $.session.set("discountPrice",parseFloat(discountPrice).toFixed(2));
     // $.session.set("taxEst",parseFloat(ShippingTax).toFixed(2));
      $.session.set("total",parseFloat(total).toFixed(2));

      $('#subtotaltxt').val($.session.get("subtotal"));
      $('#ShippingChargestxt').val($.session.get("shippingEstPrice"));

      $('#totaltxt').val($.session.get("total"));
      $('#discountPricetxt').val(discountPrice);
      $('#couponCodetxt').val($.session.get("couponCode"));
      $('#couponDiscounttxt').val($.session.get("couponDiscount"));
     // $('#subtotaltxt').val($.session.get("subtotal"));
     // $('#ShippingChargestxt').val(ShippingCharges);
     // $('#ShippingTaxtxt').val(ShippingTax);
     // $('#totaltxt').val(total);
     // $('#discountPricetxt').val(discountPrice);
     // $('#ShippingSurchargestxt').val(ShippingSurcharges);

  }


  function removeCouponCode(){
    $("#qtyloader").show();
    if($('#coupon_code').val() != ""){
        checkoutOrderLog('{{ $cart_id }}', 'couponcode_removed', "{{ date('Y-m-d H:i') }}");
    }
    $('#couponError').hide();
    $('#removeCouponCode').hide();
    $('#coupon_code').val('');
    $('#coupon_code_new').val('');
    $('.discountPriceDiv').hide();
    $('#coupon_code').attr('readonly', false);
    $.session.set("discountPrice",0);
    discountPrice = 0;
    totalcal();

}

function applyCouponCode(isremove = 0){
    if(isremove == 1){
        var coupon_code = '';
    }else{
        var coupon_code = $('#coupon_code').val();
    }


    $("#qtyloader").show();

    var totalam = $.session.get("subtotal");
    $.ajax({
        type: 'post',
        url: "{{ route('apply-coupon') }}",
        data: { "_token": '{{ csrf_token() }}','coupon_code':coupon_code,'price':totalam,'ischekoutreview':1 },
        dataType: "json",
        success: function(responce) {
            $('#couponError').show();
            if(responce.status == true){
                discountPrice = responce.data.discount;
                $('#couponDiscountDiv').html('(' + coupon_code +')');
                $.session.set("couponDiscount",responce.data.discountPerAmount);
                $.session.set("discountPrice",responce.data.discount);
                $('#couponError').text(responce.message);
                $('#couponError').removeClass('text-danger');
                $('#couponError').addClass('text-success');
                $('#removeCouponCode').show();
                $('#coupon_code').attr('readonly', true);
                iscouponinvalid = 0;
                totalcal();
                //checkoutOrderLog('{{ $cart_id }}', 'couponcode_applied', "{{ date('Y-m-d H:i') }}");
            }else{
                if ((responce.invalid_type === "category" || responce.invalid_type === "product" || responce.invalid_type === "pricingtype") && Array.isArray(responce.invalid_products) && responce.invalid_products.length > 0) {
                         $('#qtyloader').hide();
                        showInvalidCouponProductsModal(responce.invalid_products, responce.message, responce.offer_type);
                } else {
                    discountPrice = 0;
                    $('#couponDiscountDiv').html();
                    $('#couponError').text(responce.message);
                    $('#couponError').addClass('text-danger');
                    $('#couponError').removeClass('text-success');
                    $('#coupon_code').val('');
                    $('#removeCouponCode').hide();
                    $.session.set("couponDiscount",'');
                    $.session.set("discountPrice",0);
                    iscouponinvalid = 1;
                    totalcal();
                    $('#coupon_code').attr('readonly', false);
                    setTimeout(function() {
                        $('#couponError').hide();
                    }, 4000);
                }
            }
        }
    });

}

</script>
@endsection