@extends('layout.appHome')

@section('content')
<link rel='stylesheet' href="{{asset('assets/css/dashboard.css')}}" type='text/css' media='all' />

<section class="section buynow-banner"></section>

<section class="section bg-white">
    <form class="dashform" action="{{route('investstore')}}" method="POST" enctype="multipart/form-data"
        id="invest-form">

        @csrf()

        <input type="hidden" id="token_id" name="token_id" value="{{@$property->userContract->id}}">


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

                <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                    <div class="header-bar">
                        <div class="title">
                            <h2>{{$page_title}}</h2>
                        </div>

                    </div>
                </div>

                @include('common.notify')

                <div class="col-lg-8 col-md-12 col-sm-12 col-12">

                    <div class="portal-row">
                        <div class="portal-items">
                            <div class="details">
                                {{$msg}}
                            </div>
                        </div>
                    </div>

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


@endsection



@section('scripts')

<!-- <script src="https://verify.sendwyre.com/js/verify-module-init-beta.js"></script> -->


<script src="https://cdn.ethers.io/lib/ethers-5.2.umd.min.js" type="application/javascript"></script>
<script type="text/javascript" src="https://unpkg.com/web3@1.2.11/dist/web3.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/web3modal@1.9.0/dist/index.js"></script>
<script type="text/javascript" src="https://unpkg.com/evm-chains@0.2.0/dist/umd/index.min.js"></script>
<script type="text/javascript"
    src="https://unpkg.com/@walletconnect/web3-provider@1.2.1/dist/umd/index.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/fortmatic@2.0.6/dist/fortmatic.js"></script>

<script src="{{ asset('asset/package/qbatheme/js/web3Modal-checkout.js') }}"></script>

<script type="text/javascript">
    $(document).ready(function () {

        showHideWalletButtons();
        console.log("Ready!");

        // Payment Id
        let payment_id = $('.payby').val();

        // Connect Wallet Button
        const connectWalletButton = document.querySelector('#prepare');
        connectWalletButton.style.display = 'none';
        // // Wyre Button
        // const wyreButton = document.querySelector('.enableWyreButton');
        // wyreButton.style.display = 'none';


        // $('#buyWyre').click(function (e) {
        //     e.preventDefault();
        //     genReservation();
        // });



        // Get Tokens to be paid in deposit currency
        $(".payby, .no-of-token").on("change", function () {
            var token_id = $('#token_id').val();
            var no_of_token = $('.no-of-token').val();
            var payment_id = $('.payby').val();
            var payValue = $('#amount').val();
            $('#total_token_val').html(no_of_token);
            $('#qty_val').html(no_of_token);
            $('#pay_by_val').html(payment_id);


            showHideWalletButtons();

            $.ajax({
                url: "{{url('/gettokeninvestvalue')}}",
                type: "POST",
                data: {
                    'token_id': token_id,
                    'no_of_token': no_of_token,
                    'payment_id': payment_id,
                    '_token': '{{ csrf_token() }}'
                },
                success: function (result) {
                    if (result.status == 1) {
                        $('#amount').val(result.token_equ_value);
                        $('#bonus_token').val(result.bonus_token);
                        $('#total_token').val(result.total_token);
                        $('#pay_val').html(result.token_equ_value);
                    } else {
                        $('#amount').val(0);
                        $('#pay_val').html(0);
                    }
                }
            });
        });
    });

    function showHideWalletButtons() {
        var token_id = $('#token_id').val();
        var no_of_token = $('.no-of-token').val();
        var payment_id = $('.payby').val();
        var payValue = $('#amount').val();

        $('#prepare').hide();
        // $('.enableWyreButton').hide();
        if (no_of_token > 0) {
            if (payment_id == 'ETH' || payment_id == 'MATIC') { $('#prepare').show(); }
            else if (payment_id == 'WYRE') { console.log("No Wyre"); }
        }
    }

    function genReservation() {
        var token_id = $('#token_id').val();
        var no_of_token = $('.no-of-token').val();
        var payment_id = $('.payby').val();
        var payValue = $('#amount').val();
        $.ajax({
            url: "{{url('/getWyreReservation')}}",
            type: "POST",
            data: {
                'token_id': token_id,
                'no_of_token': no_of_token,
                'payment_id': payment_id,
                'payValue': payValue,
                'eth_address': '0xadB6A7Dc7FD379715E50C003a931BE28938480a4',
                '_token': '{{ csrf_token() }}'
            },
            dataType: "json",
            success: function (result) {
                //const wyreButton = document.querySelector('.enableWyreButton');
                //wyreButton.style.display = 'block';

                const widget = new Wyre({
                    env: 'test',
                    reservation: result.reservation,
                    operation: {
                        type: 'debitcard-hosted-dialog'
                    }
                });

                widget.on("paymentSuccess", function (e) {
                    console.log("paymentSuccess", e);
                });

                widget.open();
            }
        });
    }

$("#sub_proceed_btn").click(function(e){
    e.preventDefault()
    if($('#metaMaskTransactionHash').val()!=''){
        $('form#invest-form').submit();
    }
});
</script>

@endsection

@section('toRemoveLogo', 'true')