@extends('layouts.app')
@section('page-title', 'Home')

@section('head-scripts')
    <link rel="stylesheet" type="text/css"
        href="https://www.paypalobjects.com/webstatic/en_US/developer/docs/css/cardfields.css" />
    @if (!empty($client_token))
        <script
            src="https://www.paypal.com/sdk/js?components=buttons,hosted-fields&client-id={{ !empty($paypal_client_id) ? $paypal_client_id : '' }}"
            data-client-token="{{ $client_token }}"></script>
    @endif
@endsection


@section('body-content')
    <div class="global-loader-wrapper" style="display: none">
        <div class="loader"></div>
    </div>
    <!-- Shoping Cart Section -->
    <section id="wizard-form" class="pageNo-5">
        <div class="wizard-form-wrapper g_in_spacing_block">

            <div class="container">
                <div class="row">

                    @include('checkout.partials.cart-top-bar')

                    <div class="col-md-9 col-lg-9 cartProductDetailsArea">

                        <div class="wizard-shoppingCart">

                            <div class="shopping-cart-top">

                                <table class="cartTable">
                                    <thead class="cartTableHeading font-size-large text-mid-dark">

                                        <tr class="cartTableRow">

                                            <th class="cartTableHead productNamehead">Product Name</th>
                                            <th class="cartTableHead quantityhead">Quantity</th>
                                            <th class="cartTableHead pricehead">Unit Cost</th>
                                            <th class="cartTableHead amountHead">Total</th>

                                        </tr>

                                    </thead>
                                    <tbody class="cartTableBody">
                                        @php
                                            $sub_total = 0;
                                            $total_amount = 0;
                                            $cart_count = 0;
                                            // $weight = 0;
                                        @endphp
                                        <!-- first cart item -->
                                        @if (session('cart'))
                                            @foreach (session('cart') as $id => $details)
                                                @php $cart_count++ @endphp
                                                @php $sub_total += round($details['price'], 2) * $details['quantity'] @endphp
                                                {{-- @php $weight += $details['weight'] * $details['quantity'] @endphp --}}
                                                @php $total_amount += round($details['price'], 2) * $details['quantity'] @endphp
                                                <tr class="cartTableRow" data-id="{{ $id }}">
                                                    <td class="cartTableCell">
                                                        <div class="product-item">
                                                            <a href="javascript:void(0);"
                                                                class="product-thumb tosetpointer linkColor">

                                                                <img src="{{ config('constants.IMAGES_PATH') . '/' . $details['image'] }}"
                                                                    onerror="this.onerror=null; this.src='{{ config('constants.IMAGES_PATH') . '/not-available.jpg' }}'"
                                                                    alt="" width="60">

                                                                <div class="removeFromCart_container"
                                                                    title="Remove This Item">
                                                                    <i class="fa fa-times" aria-hidden="true"></i>

                                                                </div>


                                                            </a>
                                                            <div class="product-info">
                                                                <h4 class="product-title">
                                                                    <a href="{{ route('product-details', $id) }}"
                                                                        target="__blank">
                                                                        <span title="{{ strip_tags($details['name']) }}">
                                                                            {{ strip_tags($details['name']) }}
                                                                        </span>
                                                                    </a>
                                                                </h4>
                                                                <span><b>MFR: </b>{{ $details['brand'] }}</span>

                                                                <div class="product-partsInfo">
                                                                    <span style="display: inline-block;"><b>Part
                                                                            #:</b>
                                                                        {{ $details['part_no'] }}</span>
                                                                    {{-- <span class="skuText"><b>SKU:</b> 8PL072</span> --}}
                                                                </div>



                                                                <div class="form-group row" id="priceaddonsarea">
                                                                </div>
                                                            </div>
                                                        </div>


                                                    </td>
                                                    <td class="cartTableCell">
                                                        <div id="quantity">
                                                            {{-- <button type="button" id="sub" class="sub disablenotallow" data-type="minus" disabled="" style="cursor: pointer;">-</button> --}}
                                                            <input type="number" id="quantity" name="quantity"
                                                                min="1" max="99999" autocomplete="false"
                                                                class="quantityInput update-cart"
                                                                value="{{ $details['quantity'] }}">
                                                            {{-- <button type="button" id="add" class="add " data-type="plus" style="cursor: pointer;">+</button> --}}
                                                        </div>

                                                    </td>
                                                    <td class="cartTableCell price">
                                                        <span class="labelforMobile">Price: </span>
                                                        ${{ round($details['price'], 2) }}
                                                        {{-- <small>/each</small> --}}
                                                    </td>
                                                    <td class="cartTableCell price">
                                                        <span class="labelforMobile">Amount: </span>
                                                        ${{ round($details['price'], 2) * $details['quantity'] }}
                                                    </td>
                                                </tr>
                                            @endforeach
                                        @endif

                                        <!-- second cart item -->





                                    </tbody>
                                </table>


                            </div>

                            <div class="shopping-cart-bottom">

                                <div class="form-group">
                                    <label for="checkout-zip" class="">Enter Comment:</label>
                                    <textarea class="form-control" name="comments" id="comments" rows="5" maxlength="250" style="resize: none;"></textarea>
                                </div>




                            </div>



                        </div>

                    </div>

                    @include('checkout.cart-summary')
                    @include('checkout.cart-login')
                    <input type="hidden" id="csrf_token" value="{{ csrf_token() }}">
                    @include('checkout.cart-payment')


                </div>


    </section>
    <!-- End Shoping Cart Section -->


@endsection

@section('end-scripts')
    <script src="{{ asset('js/paypal.js') }}"></script>
    <script>
        var shipping_amount = 0;
        var tax_amount = 0;
        var same_billing = true;
        var zipcode_error = true;
        var handling_charges = 0;
        var is_fedex = {{ $cart_details['is_fedex'] ? 1 : 0 }};
        var is_rule_applicable = {{ $cart_details['is_applicable'] ? 1 : 0 }};
        console.log('IS FEDEX 123');
        console.log(is_fedex);
        console.log('IS FEDEX 12344');

        var user_details = JSON.parse('@php echo $user_details @endphp');
        // console.log(user_details);
        $(".update-cart").change(function(e) {
            e.preventDefault();

            var ele = $(this);
            showGlobalLoader();
            $.ajax({
                url: '/update-cart',
                method: "patch",
                data: {
                    _token: '{{ csrf_token() }}',
                    product_id: ele.parents("tr").attr("data-id"),
                    quantity: ele.parents("tr").find(".quantityInput").val()
                },
                success: function(response) {
                    hideGlobalLoader();
                    window.location.reload();
                }
            });
        });

        $(".removeFromCart_container").click(function(e) {
            e.preventDefault();
            showGlobalLoader();
            var ele = $(this);

            if (confirm("Are you sure want to remove?")) {
                $.ajax({
                    url: '/remove-from-cart',
                    method: "DELETE",
                    data: {
                        _token: '{{ csrf_token() }}',
                        product_id: ele.parents("tr").attr("data-id")
                    },
                    success: function(response) {
                        // hideGlobalLoader();
                        window.location.reload();
                    }
                });
            } else {
                hideGlobalLoader();
            }
        });

        function loadShippingStatesByCountry(country_code, state_code = '') {
            $.ajax({
                url: '/get-states?country_code=' + country_code,
                type: 'GET',
                dataType: 'json',
                success: function(data) {
                    $('#shipping_state').empty();
                    $('#shipping_state').append('<option value="">Select State</option>');
                    $.each(data, function(key, value) {
                        $('#shipping_state').append('<option value="' + value.code + '">' + value.name +
                            '</option>');
                    });
                    if (state_code != '') {
                        $('#shipping_state').val(state_code);
                    }
                }
            });
        }

        function loadBillingStatesByCountry(country_code, state_code = '') {
            // console.log("loadBillingStatesByCountry");
            // console.log(state_code);
            $.ajax({
                url: '/get-states?country_code=' + country_code,
                type: 'GET',
                dataType: 'json',
                success: function(data) {
                    $('#billing_state').empty();
                    $('#billing_state').append('<option value="">Select State</option>');
                    $.each(data, function(key, value) {
                        $('#billing_state').append('<option value="' + value.code + '">' + value.name +
                            '</option>');
                    });
                    if (state_code != '') {
                        $('#billing_state').val(state_code);
                    }
                }
            });
        }

        function loadShippingTax(state_code, country_code, zipcode) {
            var temp_sub_total = '{{ $sub_total }}';
            showSummaryLoader();
            $.ajax({
                url: '/get-tax-rate?state_code=' + state_code + "&country_code=" + country_code + '&zipcode=' +
                    zipcode,
                type: 'GET',
                dataType: 'json',
                success: function(data) {
                    // console.log(data);
                    if (data.msg == "2") {
                        zipcode_error = true;
                        $("#validationErrorText").html("Incorrect Zipcode");
                        $("#validationErrorAlert").show();
                    } else if (data.msg == "1" || data.msg == "3") {
                        $("#validationErrorText").html("");
                        $("#validationErrorAlert").hide();
                        console.log('222222222222');
                        zipcode_error = false;
                    }
                    $('#shipping_tax').empty();
                    tax_amount = (temp_sub_total * (data.rate / 100)).toFixed(2);

                    calculateGrandTotal()
                    hideSummaryLoader();
                    // $('#total_amount').text((parseFloat(shipping_amount) + parseFloat(tax_amount) + parseFloat(sub_total)).toFixed(2));
                }
            });
        }

        function calculateGrandTotal(is_applicable = false) {
            // console.log("sub_total");
            // console.log({{ $sub_total }});
            console.log("tax_amount");
            console.log(tax_amount);
            console.log("shipping_amount");
            console.log(shipping_amount);
            // setTimeout(() => {
            var grand_total = {{ $sub_total }} + parseFloat(tax_amount) + parseFloat(shipping_amount) +
                handling_charges;
            $('#shipping_tax').text('$' + parseFloat(tax_amount).toFixed(2));
            if (is_applicable == false && is_fedex == true) {
                $('#shipping_amount').text('$' + parseFloat(shipping_amount).toFixed(2));
            }

            $('#total_amount').text('$' + parseFloat(grand_total).toFixed(2));
            // }, 2000);
        }

        function loadShippingAmount(shipping_method, zipcode, address_line_1, address_line_2, city, state_code,
            line_items) {

            if (is_fedex) {
                console.log("SHIPPING IF");
                $("#validationErrorText").html("");
                $("#validationErrorAlert").hide();
                showSummaryLoader();

                $(".checkout-shipping-box .general-loaderLight-wrapper").show();

                $.ajax({
                    url: '/fetch-fedex-rate',
                    type: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}',
                        'service_type': shipping_method,
                        'address_line_1': address_line_1,
                        'address_line_2': address_line_2,
                        'city': city,
                        'state_code': state_code,
                        'line_items': line_items,
                        'zipcode': zipcode,
                    },
                    dataType: 'json',
                    success: function(data) {
                        console.log("PRE ORE PRE 222222");
                        console.log(data);
                        $('#shipping_amount').empty();
                        $('#shipping_amount_2').empty();
                        if (data.error == false && data.is_applicable == false) {
                            $('#shipping_amount').text("$" + data.rate);
                            $('#shipping_amount_2').text("$" + data.rate);
                            shipping_amount = data.rate;
                        } else {
                            $('#shipping_amount').text('As Applicable');
                            $('#shipping_amount_2').text('As Applicable');
                            var errorArray = [];
                            data.error_msg.forEach(checkFedexError);

                            function checkFedexError(item) {
                                if (item.code === "DESTINATION.POSTALCODE.MISSING.ORINVALID") {
                                    errorArray.push(item.message);
                                } else if (item.code === "COUNTRY.POSTALCODEORZIP.INVALID") {
                                    errorArray.push(item.message);
                                } else if (item.code === "POSTALCODE.ZIPCODE.REQUIRED") {
                                    errorArray.push(item.message);
                                } else if (item.code === "CITY.REQUIRED") {
                                    errorArray.push(item.message);
                                } else if (item.code === "COUNTRY.POSTALCODE.INVALID") {
                                    errorArray.push(item.message);
                                } else if (item.code === "ENTERED.ZIPCODE.NOTFOUND") {
                                    errorArray.push(item.message);
                                } else if (item.code === "FEDEXSERVICE.NOT.AVAILABLE") {
                                    errorArray.push(item.message);
                                } else if (item.code === "ORIGIN.COUNTRY.REQUIRED") {
                                    errorArray.push(item.message);
                                } else if (item.code === "STATE.TYPE.INVALID") {
                                    errorArray.push(item.message);
                                } else if (item.code === "STATE.TYPE.REQUIRED") {
                                    errorArray.push(item.message);
                                } else if (item.code === "DESTINATION.COUNTRY.INVALID") {
                                    errorArray.push(item.message);
                                } else if (item.code === "RATING.DESTINATIONSTATEPOSTAL.MISMATCH") {
                                    errorArray.push(item.message);
                                } else if (item.code === "SERVICETYPE.NOT.ALLOWED") {
                                    errorArray.push(item.message);
                                } else if (item.code === "SERVICE.TYPE.NOTAVAILABLE") {
                                    errorArray.push(item.message);
                                } else {
                                    errorArray.push("Shipping maybe charged in future.");
                                }
                            }
                            if (errorArray.length > 0) {
                                console.log('33333333333333');
                                zipcode_error = true;
                            } else {
                                console.log('11111111111111111');
                                zipcode_error = false;
                            }
                            var strongElement = document.getElementById("validationErrorText");
                            // errorMessages = data.error_msg[0].message;
                            errorMessageList = convertObjectToList(errorArray);
                            strongElement.innerHTML = errorMessageList;

                            $("#validationErrorAlert").show();
                            shipping_amount = data.rate;
                        }


                        calculateGrandTotal(data.is_applicable);
                        hideSummaryLoader();
                        // $('#total_amount').text((parseFloat(shipping_amount) + parseFloat(tax_amount) + parseFloat(sub_total)).toFixed(2));

                    }
                });
            } else {
                console.log("SHIPPING ELSE");
                $('#shipping_amount').empty();
                $('#shipping_amount_2').empty();
                $('#shipping_amount').text("$" + "{{ $cart_details['freight_charges'] }}");
                shipping_amount = {{ $cart_details['freight_charges'] }};
                calculateGrandTotal();
            }

        }

        function loadHandlingCharges() {
            $.ajax({
                url: '/fetch-handling-charges',
                type: 'GET',
                dataType: 'json',
                success: function(result) {
                    handling_charges = result.data;
                    $('#handling_amount').text("$" + result.data);
                    calculateGrandTotal();
                    // console.log(data);

                }
            });
        }

        $(document).ready(function() {

            loadHandlingCharges();
            @if (empty($client_token))
                paymentOptionsVisibiltyControl('manual_credit_card');
            @endif
            if ({{ !empty($cart_details['billing_country']) ? 'true' : 'false' }} == true) {
                // console.log('subtotal');
                // console.log(subtotal);
                // setTimeout(() => {
                showGlobalLoader();
                loadShippingStatesByCountry('{{ $cart_details['shipping_country'] }}',
                    '{{ $cart_details['shipping_state'] }}');
                loadBillingStatesByCountry('{{ $cart_details['billing_country'] }}',
                    '{{ $cart_details['billing_state'] }}');

                loadShippingAmount('{{ $cart_details['fedex_shipping_type'] }}',
                    '{{ $cart_details['shipping_zipcode'] }}',
                    '{{ $cart_details['shipping_address_line_1'] }}',
                    '{{ $cart_details['shipping_address_line_2'] }}', '{{ $cart_details['shipping_city'] }}',
                    '{{ $cart_details['shipping_state'] }}', {{ $cart_count }});

                loadShippingTax('{{ $cart_details['shipping_state'] }}',
                    '{{ $cart_details['shipping_country'] }}', '{{ $cart_details['shipping_zipcode'] }}');
                hideGlobalLoader();
                // }, 2000);

                @if ($cart_details['same_billing'] != 'true')
                    {
                        same_billing = false;
                        $('#billing-address-section').show();
                    }
                @endif
            } else {
                showGlobalLoader();
                if (!is_fedex) {
                    $('#shipping_amount').empty();
                    $('#shipping_amount_2').empty();
                    $('#shipping_amount').text("${{ $cart_details['freight_charges'] }}");
                    shipping_amount = {{ $cart_details['freight_charges'] }};
                }

                // shipping_amount = {{ $cart_details['freight_charges'] }};
                calculateGrandTotal(is_rule_applicable);
                hideGlobalLoader();
            }

            $("#same-billing-address").on("change", function() {
                console.log('same-billing-address');
                if ($(this).prop("checked")) {
                    // Checkbox is checked
                    $('#billing-address-section').hide();
                    same_billing = true;
                    // console.log("Checkbox is checked.");
                } else {
                    // Checkbox is unchecked
                    same_billing = false;
                    $('#billing-address-section').show();
                    // console.log("Checkbox is unchecked.");
                }
            });
            // Country Dropdown change event
            $('#shipping_country').on('change', function() {
                var country_code = $(this).val();
                if (country_code) {
                    loadShippingStatesByCountry(country_code);
                } else {
                    $('#shipping_state').empty();
                    $('#shipping_state').append('<option value="">Select State</option>');
                }
            });

            $('#shipping_state').on('change', function() {
                $('#shipping_zip').val('');
                $("#shipping_method").val('');
                $("#shipping_amount_2").text('$0');
                if (is_fedex) {
                    shipping_amount = 0
                }
                tax_amount = 0;

                calculateGrandTotal();

            });

            $('#billing_state').on('change', function() {
                $('#billing_zip').empty();
            });

            $('#billing_country').on('change', function() {
                var country_code = $(this).val();
                if (country_code) {
                    loadBillingStatesByCountry(country_code);
                } else {
                    $('#billing_state').empty();
                    $('#billing_state').append('<option value="">Select State</option>');
                }
            });

            $('#shipping_method').on('change', function() {
                var validationShippingResultFedex = validateShippingDetails();
                if (validationShippingResultFedex.error) {
                    var strongElement = document.getElementById("validationErrorText");
                    errorMessages = validationShippingResultFedex.errorArray;
                    errorMessageList = convertObjectToList(errorMessages);
                    strongElement.innerHTML = errorMessageList;
                    $("#validationErrorAlert").show();
                } else {
                    shipping_address_error = false;
                    // moduleNum = 4;
                    $("#validationErrorText").html("");
                    $("#validationErrorAlert").hide();
                    $('.checkout-shipping-box .general-loader-wrapper').css('display', 'block');
                    console.log($('.checkout-shipping-box .general-loader-wrapper'));
                    var sub_total = {{ $sub_total }};
                    var shipping_method = $(this).val();
                    var shipping_zip = $('#shipping_zip').val();
                    var shipping_address_line_1 = $('#shipping_address_line_1').val();
                    var shipping_address_line_2 = $('#shipping_address_line_2').val();
                    var shipping_city = $('#shipping_city').val();
                    var shipping_state = $('#shipping_state').val();
                    if (shipping_method) {
                        loadShippingAmount(shipping_method, shipping_zip,
                            shipping_address_line_1, shipping_address_line_2, shipping_city,
                            shipping_state,
                            {{ $cart_count }})
                        loadHandlingCharges();
                        $('.checkout-shipping-box .general-loader-wrapper').hide();
                    } else {
                        $('#shipping_amount').empty();
                        $('#shipping_amount_2').empty();
                        $('.checkout-shipping-box .general-loader-wrapper').hide();
                    }
                }
            });

            $('#card_country').on('change', function() {
                var country_code = $(this).val();
                if (country_code) {
                    $.ajax({
                        url: '/get-states?country_code=' + country_code,
                        type: 'GET',
                        dataType: 'json',
                        success: function(data) {
                            $('#card_state').empty();
                            $('#card_state').append('<option value="">Select State</option>');
                            $.each(data, function(key, value) {
                                $('#card_state').append('<option value="' + value.code +
                                    '">' + value.name + '</option>');
                            });
                        }
                    });
                } else {
                    $('#card_state').empty();
                    $('#card_state').append('<option value="">Select State</option>');
                }
            });

            $('#shipping_zip').on('keyup', function() {
                var zipcode = $(this).val();
                if (zipcode.length >= 5) {
                    $("#shipping_method").val('');
                    $("#shipping_amount_2").text('$0');
                    if (is_fedex) {
                        shipping_amount = 0;
                    }
                    tax_amount = 0;
                    // calculateGrandTotal();
                    // Fetch the selected state code from the #shipping_state select element
                    var state_code = $('#shipping_state').val();
                    // alert(state_code);
                    var country_code = $('#shipping_country').val();
                    var zipcode = $(this).val(); // Get the value entered in the #shipping_zip input field
                    var sub_total = {{ $sub_total }};
                    if (state_code && country_code && zipcode) {
                        loadShippingTax(state_code, country_code, zipcode)
                    } else {
                        $('#shipping_tax').empty();
                    }
                }

            });

        });
    </script>
    <script src="{{ asset('js/cart.js?v=') . config('constants.VERSION') }}"></script>
@endsection