@extends('user.layouts.index')
@section('page_content')

<link rel="stylesheet" href="{{asset ('css/loginpage.css')}}">
<link rel="stylesheet" href="{{ asset('css/home.css') }}">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css">
<link href="{{ asset('css/newmake.css') }}" rel="stylesheet">
<link href="{{ asset('css/proceedpayment.css') }}" rel="stylesheet">
<link href="{{ asset('css/mainstudentdash.css') }}" rel="stylesheet">






    <!-- Main content: shift it to the right by 250 pixels when the sidebar is visible -->
    {{-- <div class="w3-main mainContent" style="margin-left:250px"> --}}





 <!--LOGIN PAGE BORDER-->
 <section class="login-page-border">
    <div class="row paymentarea">
        <div class="col-sm-12">
            <div class="paymentareadata">
                <h3>Sell Coins</h3>
            </div>
        </div>
    </div>
</section>

<!-- LOGIN SECTION -->
<section class="login-section">
    <div class="container-fluid login-container">
        @if ($message = Session::get('success'))
        <div class="alert alert-success alert-block">
            <button type="button" class="close" data-dismiss="alert">×</button>
            <strong>{{ $message }}</strong>
        </div>

    @elseif( $message = Session::get('error'))
        <div class="alert alert-danger text-center">
            <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
            <p>{{ $message }}</p>
        </div>
    @endif
        {{-- <form method="post" action="{{ url('/user/login') }}"> --}}
            {{-- {{ csrf_field() }} --}}




<div>
    {!! Form::open(['method' => 'get', 'route' => ['user.amount_get']]) !!}
            <div class="row">
                <div class="col-12 col-sm-12 col-md-12 col-lg-2 col-xl-2">
                    <label for="my-input text-secondary"><b class="text-secondary"></b></label>
                </div>
                <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                    <div class="form-group">
                        <label for="my-input text-secondary"><b class="text-secondary">Enter Amount For Sale Coins </b></label>
                    </div>
                    <div class="form-group">

                 <input  type="number"  onkeyup="input_dollar()" class="form-control" id="dollartext" name="points" placeholder="Enter Coin"
                 min="1"
                 step="1">
                 {{-- name="dollar" --}}


                 <label id="show_points" class="form-control"  name="show_points"  >Amount : 0</label>
                 <input type="hidden" id="show_coins_hidden" name="cost">
                    </div>
                </div>
                <div class="col"></div>
            </div>

        <div class="col-2 padding-top-bottom-btn-col">

             <button class="btn btn-sm btn-primary check-out-btn mypayment">Submit</button>



            </div>
            {!! Form::close() !!}
</div>



            <div class="col-12 text-center">
                <p class="text-break text-secondary"></p>
            </div>

        </div>

    </div>




            {{-- <div class='form-row row'>
                <div class='col-md-12 error form-group hide'>
                    <div class='alert-danger alert'>Please correct the errors and try
                        again.</div>
                </div>
            </div> --}}

            {{-- <div class="row">
                <div class="pformclick">
                    <button class="btn btn-primary btn-lg pformpress" type="submit">Place
                        Order</button>

                </div>
            </div> --}}






        {{-- <div class="row">
            <div class="col-12 text-center text-secondary">
               <b>Forgot Your Password ?</b>
            </div>
            <div class="col-12 text-center login-btn-div">
                <button class="btn btn-lg btn-primary login-button">Login</button>
                <hr class="separater">
            </div>--}}


</section>







    </div>



@endsection

@section('app_jquery')
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>

<script>


$(function(){
    var $form = $(".require-validation");

    $('form.require-validation').bind('submit', function(e) {
        var $form = $(".require-validation"),
            inputSelector = ['input[type=email]', 'input[type=password]',
                'input[type=text]', 'input[type=file]',
                'textarea'
            ].join(', '),
            $inputs = $form.find('.required').find(inputSelector),
            $errorMessage = $form.find('div.error'),
            valid = true;
        $errorMessage.addClass('hide');

        $('.has-error').removeClass('has-error');
        $inputs.each(function(i, el) {
            var $input = $(el);
            if ($input.val() === '') {
                $input.parent().addClass('has-error');
                $errorMessage.removeClass('hide');
                e.preventDefault();
            }
        });

        if (!$form.data('cc-on-file')) {
            e.preventDefault();
            Stripe.setPublishableKey($form.data('stripe-publishable-key'));
            Stripe.createToken({
                number: $('.card-number').val(),
                cvc: $('.card-cvc').val(),
                exp_month: $('.card-expiry-month').val(),
                exp_year: $('.card-expiry-year').val()
            }, stripeResponseHandler);
        }

    });

    function stripeResponseHandler(status, response) {
        if (response.error) {
            $('.error')
                .removeClass('hide')
                .find('.alert')
                .text(response.error.message);
        } else {
            /* token contains id, last4, and card type */
            var token = response['id'];

            $form.find('input[type=text]').empty();
            $form.append("<input type='hidden' name='stripeToken' value='" + token + "'/>");
            $form.get(0).submit();
        }
    }
})

function setAmount(){
    $('#amount').val($('#dollartext').val());
    // $('#points').val($('#points').val());
    return true;
}


function input_dollar(){

    var dollartext  =  $('#dollartext').val();
        var check_number = /^\d*$/.test(dollartext);

        console.log('==========pay=======',dollartext);



    if(!check_number || dollartext == ''){
        console.log('true');
        $('#dollartext').val("");
        $('#show_points').html("0 $");
        return;
    }
    console.log('false');
    dollartext = parseInt(dollartext);
    // var points = dollartext * 0.002;
    // var points = dollartext * (1/0.02);
  var coin = dollartext ;

//     console.log('coin',coin);


    var coin = coin * (1/ parseFloat('{!! $sell_point->value !!}') );

    $('#show_points').html(coin + " $");


    console.log('coin',coin);
    $('#show_coins_hidden').val(coin);



    //



}

















    </script>


@endsection
{{--
     <div class="row">
            <div class="col-12 col-sm-12 col-md-12 col-lg-2 col-xl-2">
                <label for="my-input text-secondary"><b class="text-secondary"></b></label>
            </div>
            <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                <div class="form-group">
                    <label for="my-input text-secondary"><b class="text-secondary">Points Show</b></label>
                </div>
                <div class="form-group">
                    <input id="show_points" class="form-control"  name="show_points"  >
                </div>
            </div>
            <div class="col"></div>
        </div> --}}