@extends('layouts.app')

@section('content')
    <div class="breadcrumb_section page-title-mini">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-md-6">
                    <div class="page-title">
                        <h1 class="text-white">Checkout</h1>
                    </div>
                </div>
                <div class="col-md-6">
                    <ol class="breadcrumb justify-content-md-end">
                        <li class="breadcrumb-item"><a href="{{route('index')}}" class="text-white">Home</a></li>
                        <li class="breadcrumb-item text-white active">Checkout</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>

    @if(\Auth::user())
        @php
            $cart_subtotal = App\Models\ShoppingCart::where('user_id', '=', \Auth::user()->id)->sum('subtotal');
            $cart_total = App\Models\ShoppingCart::where('user_id', '=', \Auth::user()->id)->sum('cart_total');
            $shopping_cart = App\Models\ShoppingCart::where('user_id', '=', \Auth::user()->id)->get();
            // dd($shopping_cart);
        @endphp
    @else
        @php
            $cart_subtotal = Cart::subtotal();
            $cart_total = Cart::total();
            $shopping_cart = Cart::content();
            // dd($shopping_cart);
        @endphp
    @endif

    <div class="main_content">
        <div class="section">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        @include('layouts.session')
                    </div>
                    {{-- @guest
                        <div class="col-lg-6">
                            <div class="toggle_info">
                                <span><i class="fas fa-user"></i>Returning customer? <a href="#loginform" data-toggle="collapse" class="collapsed text-dark" aria-expanded="false">Click here to login</a></span>
                            </div>
                            <div class="panel-collapse collapse login_form" id="loginform">
                                <div class="panel-body">
                                    <p>If you have shopped with us before, please enter your details below. If you are a new customer, please proceed to the Billing &amp; Shipping section.</p>
                                    <form method="POST" action="{{ route('login') }}" class="form-horizontal user_login_form">
                                        @csrf
                                        <div class="form-group">
                                            <input type="email" required="" class="form-control" name="email" placeholder="Email">
                                            @if ($errors->has('email'))
                                                <div class="invalid-feedback">{{ $errors->first('email') }}</div>
                                            @endif
                                        </div>
                                        <div class="form-group">
                                            <input class="form-control" required="" type="password" name="password" placeholder="Password">
                                            @if ($errors->has('password'))
                                                <div class="invalid-feedback">{{ $errors->first('password') }}</div>
                                            @endif
                                        </div>
                                        <div class="login_footer form-group">
                                            <div class="chek-form">
                                                <div class="custome-checkbox">
                                                    <input class="form-check-input" type="checkbox" name="checkbox" id="remember" value="">
                                                    <label class="form-check-label" for="remember"><span>Remember me</span></label>
                                                </div>
                                            </div>
                                            <a href="{{ route('password.request') }}">Forgot password?</a>
                                        </div>
                                        <div class="form-group">
                                            <button type="submit" class="btn btn-fill-out btn-block" name="login">Log in</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    @endguest --}}
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="medium_divider"></div>
                        <div class="divider center_icon"><i class="linearicons-credit-card"></i></div>
                        <div class="medium_divider"></div>
                    </div>
                </div>

                <form method="post" action="" class="checkout_form">
                    @csrf
                    <div class="row">
                        <div class="col-md-6">
                            <div class="heading_s1">
                                <h4 class="text-white">Shipping Details</h4>
                            </div>
                            <div class="form-group">
                                <input type="text"  class="form-control" name="fname" required onkeypress="return (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123)" placeholder="First name *" value="{{ Auth::user() ? $user->first_name : old('fname') }}">
                            </div>
                            <div class="form-group">
                                <input type="text"  class="form-control" name="lname" required onkeypress="return (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123)" placeholder="Last name *" value="{{ Auth::user() ? $user->last_name : old('lname')}}">
                            </div>
                            <div class="form-group">
                                <input type="text" class="form-control" name="address" required placeholder="Address *" value="{{ Auth::user() ? $user->address : ''}}">
                            </div>
                            <div class="form-group">
                                <input type="text" class="form-control" name="address2" placeholder="Address line2" value="{{ Auth::user() ? $user->address_line : ''}}">
                            </div>
                            <div class="form-group">
                                <input class="form-control"  type="text" name="city" required placeholder="City / Town *" value="{{ Auth::user() ? $user->city : ''}}">
                            </div>
                            <div class="form-group">
                                <input class="form-control"  type="text" name="state" required placeholder="State / County *" value="{{ Auth::user() ? $user->state : ''}}">
                            </div>
                            <div class="form-group">
                                <input class="form-control"  type="number" min="0" name="zipcode" required placeholder="Postcode / ZIP *" value="{{ Auth::user() ? $user->zipcode : ''}}">
                            </div>
                            {{-- <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text" id="basic-addon1">+44</span>
                                </div>
                                <input class="form-control" min="0" minlength="9" maxlength="14" id="mobile_no" required type="text"  name="mobile_no" placeholder="Mobile Number *" value="{{ Auth::user() ? $user->mobile_no : ''}}">
                            </div>  --}}
                            <div class="form-group">
                                <input class="form-control" min="0" minlength="9" maxlength="14" id="mobile_no" required type="text"  name="mobile_no" placeholder="Mobile Number *" value="{{ Auth::user() ? $user->mobile_no : ''}}">
                                <small class="form-text text-muted"><b>Note:</b> Enter mobile number with country code.</small>
                            </div>
                            <div class="form-group">
                                <input class="form-control email"  type="email" name="email" required placeholder="Email address *" value="{{ Auth::user() ? $user->email : old('email') }}">
                                {{-- @if(!Auth::user())
                                    <div class="invalid-feedback email_validation_div"></div>
                                @endif --}}
                            </div>

                            {{-- <div class="ship_detail">
                                <div class="form-group">
                                    <div class="chek-form">
                                        <div class="custome-checkbox">
                                            <input class="form-check-input" type="checkbox" name="ship_checkbox" id="differentaddress">
                                            <label class="form-check-label label_info" for="differentaddress"><span class="text-white">Billing to a different address?</span></label>
                                        </div>
                                    </div>
                                </div>
                                <div class="different_address">
                                    <div class="form-group">
                                        <input type="text" required class="form-control" name="billing_fname" placeholder="First name *">
                                    </div>
                                    <div class="form-group">
                                        <input type="text" required class="form-control" name="billing_lname" placeholder="Last name *">
                                    </div>
                                    <div class="form-group">
                                        <input type="text" class="form-control" name="billing_address" required="" placeholder="Address *">
                                    </div>
                                    <div class="form-group">
                                        <input type="text" class="form-control" name="billing_address2" placeholder="Address line2">
                                    </div>
                                    <div class="form-group">
                                        <input class="form-control" required type="text" name="billing_city" placeholder="City / Town *">
                                    </div>
                                    <div class="form-group">
                                        <input class="form-control" required type="text" name="billing_state" placeholder="State / County *">
                                    </div>
                                    <div class="form-group">
                                        <input class="form-control" required type="number" min="0" name="billing_zipcode" placeholder="Postcode / ZIP *">
                                    </div>
                                </div>
                            </div> --}}

                        </div>
                        <div class="col-md-6">
                            <div class="order_review">
                                <div class="heading_s1">
                                    <h4>Your Order</h4>
                                </div>
                                <div class="table-responsive order_table">
                                    <table class="table">
                                        <thead>
                                            <tr>
                                                <th>Product</th>
                                                <th>Price</th>
                                                <th>Total</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if(\Auth::user())
                                                @php
                                                    $shopping_cart = App\Models\ShoppingCart::where('user_id', '=', \Auth::user()->id)->get();
                                                    // $product_sum = App\Models\ShoppingCart::whereHas('product', function($query) {
                                                    //     $query->where('user_id', '=', \Auth::user()->id);
                                                    // })->sum('subtotal');
                                                @endphp
                                                @forelse($shopping_cart as $key => $cart)
                                                    <tr>
                                                        <td>{{$cart->product_name}} ({{$cart->color}}) ({{$cart->size}})<span class="product-qty"> x {{$cart->quantity}}</span></td>
                                                        <td>{{Helper::setPriceFormat($cart->price)}}</td>
                                                        <td>{{Helper::setPriceFormat($cart->price * $cart->quantity)}}</td>
                                                    </tr>
                                                @empty
                                                    <tr>
                                                        <td colspan="3">No Item in your cart</td>
                                                    </tr>
                                                @endforelse
                                            @else
                                                @forelse(Cart::content() as $key => $cart)
                                                    <tr>
                                                        <td>{{$cart->name}} ({{$cart->options->color}}) ({{$cart->options->size}})<span class="product-qty"> x {{$cart->qty}}</span></td>
                                                        <td>{{Helper::setPriceFormat($cart->price)}}</td>
                                                        <td>{{Helper::setPriceFormat($cart->price * $cart->qty)}}</td>
                                                    </tr>
                                                @empty
                                                    <tr>
                                                        <td colspan="3">No Item in your cart</td>
                                                    </tr>
                                                @endforelse
                                            @endif
                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <th>SubTotal</th>
                                                <td colspan="3" align="right" class="product-subtotal">{{Helper::setPriceFormat($cart_subtotal)}}</td>
                                            </tr>
                                            <tr>
                                                <th>Total</th>
                                                @if(Auth::user())
                                                    <td colspan="3" align="right" class="product-subtotal">{{Helper::setPriceFormat($cart_total) }}</td>
                                                @else
                                                    <td colspan="3" align="right" class="product-subtotal">{{Helper::setPriceFormat($cart_total)}}</td>
                                                @endif
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                                <div class="payment_method">
                                    <div class="heading_s1">
                                        <h4>Payment Via Your Wallet Under <label class="pl-5 text-warning">{{Helper::getNetworks()}}</label></h4>
                                    </div>
                                    {{-- <div class="payment_option">
                                        <div class="custome-radio">
                                            <input class="form-check-input" type="radio" name="payment_option" id="paypal" value="paypal" checked="">
                                            <label class="form-check-label" for="paypal">Paypal</label> <img class="float-right" src="{{asset('frontend/assets/images/paypal.png')}}" alt="paypal">
                                        </div>
                                    </div> --}}
                                    <div class="payment_option">
                                        <div class="custome-radio">
                                            <input class="form-check-input" type="radio" name="payment_option" id="paypal" value="paypal" checked="">
                                            <label class="form-check-label" for="eth">{{Helper::getCurrency()}}</label>
                                        </div>
                                    </div>
                                    <div class="mt-4">
                                        <span class="text-lightgray font-weight-normal h6 text-center">
                                            <small><b>Note: </b>Please don't change transaction amount during transaction, if you do so you will loss your tokens and not able to order product.
                                            </small>
                                        </span>
                                    </div>
                                </div>
                                <button type="submit" class="btn btn-fill-out btn-block place_order_btn" name="place_order_btn">Place Order</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

@endsection

@push('js')
<script>
    $(function(){
        $("#mobile_no").keypress(function (e) {
            // console.log(e.which);
            //if the letter is not digit then display error and don't type anything
            if (e.which != 8 && e.which != 0 && e.which != 43 && (e.which < 48 || e.which > 57)) {
                //display error message
                // $("#errmsg").html("Digits Only").show().fadeOut("slow");
                return false;
            }
        });

        // $(".email").blur(function(){
        //     var user_email = $(".email").val();
        //     $.ajax({
        //         url:'{{ route("ajax.check_registered_user") }}',
        //         data: {
        //             'email': user_email,
        //         },
        //         success:function(response)
        //         {
        //             if(response.status == 'error'){
        //                 $(".email_validation_div").text(response.msg);
        //             }
        //             else{
        //                 $(".email_validation_div").text('');
        //             }
        //         }
        //     })
        // });

        // $(document.body).on('click', '.place_order_btn', function(){
        //     // alert('ji n');
        // })

        window.addEventListener('load', async() => {
            // if(getCookie('wallet_address') != ''){
                connectMetaMask();
            // }
        });

        $(".checkout_form").validate({
            //ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
            // eslint-disable-next-line object-shorthand
            // errorElement: 'em',
            highlight: function highlight (element) {
                $(element).addClass('is-invalid').removeClass('is-valid');
            },
            // eslint-disable-next-line object-shorthand
            unhighlight: function unhighlight (element) {
                $(element).addClass('is-valid').removeClass('is-invalid');
            },

            // Different components require proper error label placement
            errorPlacement: function errorPlacement (error, element) {
                error.addClass('invalid-feedback');

                if (element.prop('type') === 'checkbox') {
                    error.insertAfter(element.parent('label'));
                } else {
                    error.insertAfter(element);
                }
            },
            validClass: "validation-valid-label",
            success: function (label, element) {
                // label.addClass("validation-valid-label").text("Successfully")
                //label.parent().removeClass('error');
                $(element).closest('.form-group').removeClass('has-error');
                label.remove();
                // console.log(label);
            },
            submitHandler: function (form) {
                // form.submit();
                // var me = $('.checkout_form');
                
                // console.log($('.checkout_form').serialize());
                startProcess();
            },
            rules: {
            },
            messages: {

            }
        });

        
    });

    function pickup_datetime(start_time = '10:00:00', end_time = '21:00:00'){
        var dateToday = new Date();
        var hour = dateToday.getHours();
        dateToday.setDate(dateToday.getDate() + 1);
        $(".pickup_datetime").datetimepicker({
            timeFormat: 'HH:00',
            hour: hour+1,
            // // beforeShowDay: $.datepicker.noWeekends,
            // beforeShowDay: disable_day,
            minTime: start_time,
            maxTime: end_time,
            format: 'Y-m-d H:i',
            minDate: dateToday
        });

        // return false;

        // var minDate = new Date();
        // // minDate.setHours(minDate.getHours() + 30);
        // minDate.setDate(minDate.getDate() + 1);
        // $( ".pickup_datetime" ).datetimepicker({
        //     // minDate: moment().add(minutes, 'minutes'),
        //     // minDate: moment().add(minutes, 'minutes').toDate(),
        //     minDate: minDate,
        //     // stepMinute: 30,
        //     //formatTime:'Y-m-d H:i',
        //     format:'Y-m-d H:i',
        //     // stepping: 15,
        //     // step: 15 ,
        //     // 'minTime': '5:00',
        //     allowTimes:[
        //         '11:00',
        //         '12:00',
        //         '13:00',
        //         '14:00',
        //         '15:00',
        //         '16:00',
        //         '17:00',
        //         '18:00',
        //         '19:00',
        //         '20:00',
        //         '21:00',
        //     ],
        //     beforeShowDay : disable_day,

        //     // maxDate: "+1M +10D"
        // });
    }

    function validateMobileNo(numberField){
        var reg = /^\d{11}$/;

        if (reg.test(numberField.value) == false)
        {
            alert('Invalid Mobile Number');
            return false;
        }
        return true;
    }


    function startProcess() {
        var price = parseFloat();
        if (price > 0) {
            showLoader();
            EThAppDeploy.loadEtherium();
        } else {
            alert('Invalid Amount');
        }
    }

    EThAppDeploy = {
        loadEtherium: async () => {
            if (typeof window.ethereum !== 'undefined') {
                EThAppDeploy.web3Provider = ethereum;
                EThAppDeploy.requestAccount(ethereum);
            } else {
                SwalModel('Error!', 'Not able to locate an Ethereum connection, please install a Metamask wallet', 'error');
                window.location.href="https://metamask.io/download/";
            }
        },
        
        requestAccount: async (ethereum) => {
            ethereum
                .request({
                    method: 'eth_requestAccounts'
                })
                .then((resp) => {
                    const from_address = resp[0];
                    if(from_address == ''){
                        SwalModel('Error!', 'Failde to connect account.', 'error');
                    }
                    // EThAppDeploy.payNow(ethereum, resp[0], contractABI);
                    EThAppDeploy.payNow(ethereum, resp[0]);
                })
                .catch((err) => {
                    SwalModel('Warning!', err.message, 'warning');
                });
        },
        
        payNow: async (ethereum, from) => {
            // var shopping_cart = new Array({{ $shopping_cart }}});
            var shopping_cart = JSON.parse(`{!!json_encode($shopping_cart)!!}`);
            var contractAddress = `{{Helper::getSetting()->token_address}}`
            var receiver = `{{Helper::getWalletAddress()}}`;
            var currentUser = web3.eth.accounts[0]
            var amount = {{$cart_total}};
            var start = '1';
            var token_decimals = parseInt(`{{Helper::getSetting()->token_decimals}}`) + 1;
            var decimal = start.padEnd(token_decimals,0);
            var finel_amount = '0x' + ((amount * decimal).toString(16));
            var dataHax = getDataHax(receiver, finel_amount);
            // var form_data = $('.checkout_form').serialize();

            // console.log(shopping_cart);
            // console.log(dataHax);
            // storeTransaction(from, 'txHash', amount, shopping_cart);
            // return false;

            ethereum
                .request({
                    method: 'eth_sendTransaction',
                    params: [{
                        from: from,
                        to: contractAddress,
                        data: dataHax
                    }],
                })
                .then((txHash) => {
                    if (txHash) {
                        (async () => {
                            var get_tra_detail = await getTransactionDetails(txHash);
                            console.log(get_tra_detail.input);
                            if(get_tra_detail.input == dataHax){
                                storeTransaction(from, txHash, amount, shopping_cart);
                            }else{
                                SwalModel('Error!', 'Order amount and transaction amount done not match.', 'error');
                            }
                        })()

                    } else {
                        SwalModel('Error!', 'Something went wrong. Please try again.', 'error');
                    }
                })
                .catch((error) => {
                    SwalModel('Error!', error.message, 'error');
                });
            
        },
    }

    function getDataHax(to_address, amount){
        var response = web3.eth.abi.encodeFunctionCall({
                name: 'transfer',
                type: 'function',
                inputs: [{
                    type: 'address',
                    name: 'recipient'
                },{
                    type: 'uint256',
                    name: 'amount'
                }]
            }, [to_address, amount]);
        return response;
    }

    function storeTransaction(from, txHash, amount, shopping_cart, form_data) {
        var form = $('.checkout_form');
        var formData = {
            fname: form.find('[name="fname"]').val(),
            lname: form.find('[name="lname"]').val(),
            address: form.find('[name="address"]').val(),
            address2: form.find('[name="address2"]').val(),
            city: form.find('[name="city"]').val(),
            state: form.find('[name="state"]').val(),
            zipcode: form.find('[name="zipcode"]').val(),
            mobile_no: form.find('[name="mobile_no"]').val(),
            email: form.find('[name="email"]').val(),
        };

        $.ajax({
            url: "{{ route('checkouts.store') }}",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            type: 'POST',
            data: {
                txHash: txHash,
                amount: amount,
                shopping_cart: shopping_cart,
                account: from,
                form_data: formData,
                is_auth: `{{\Auth::check() ? 'true' : 'false'}}`
            },
            // data: $('.checkout_form').serialize() + "&txHash="+txHash + "&amount="+amount + "&shopping_cart="+shopping_cart + "&account="+from,
            success: function (response) {
                hideLoader();
                var session = response.msg;
                if(response.status){
                    Swal.fire({
                        title: 'Success!',
                        text: session,
                        type: 'success',
                        timer: 2000
                    }).then(function() {
                        window.location = "{{route('checkouts.success')}}";
                    });
                }else{
                    SwalModel('Error!', session, 'error');
                }
            }
        });
    }



</script>
@endpush