@extends('website.layout.master')
@section('main-content')
@include('website.pages.partial.breadcrumb',[
'title1' => 'Donate',
'title2' => 'Donate'
])
<section>
    <div class="gap">
        <div class="container">
            <div class="sec-title text-center">
                <div class="sec-title-inner">
                    <span></span>
                    <h3>Donation Form</h3>
                </div>
            </div>
            <div class="contact-form text-center">
                <form method="POST" action="{{route('stripe.makeStripePayment')}}" enctype="multipart/form-data">
                    @include('website.messages.message')

                    {{ csrf_field() }}
                    <input type="hidden" name="subject" value="Donation">
                    <div class="row mrg20">
                        <div class="col-md-6 col-sm-6 col-lg-6">
                            <input type="text" name="name" placeholder="Name*" rrequired>
                        </div>
                        <div class="col-md-6 col-sm-6 col-lg-6">
                            <input type="text" name="contact_number" placeholder="Phone">
                        </div>
                        <div class="col-md-12 col-sm-12 col-lg-12">
                            <input type="text" name="full_address" placeholder="Full Address">
                        </div>
                        <div class="col-md-6 col-sm-6 col-lg-6">
                            <select name="currency" id="" class="form-control" rrequired>
                                <option value disabled selected>Choose Currency*</option>
                                <option value="AUD">AUD</option>
                                <option value="USD">US Dollar</option>
                            </select>
                        </div>
                        <div class="col-md-6 col-sm-6 col-lg-6">
                            <input type="text" name="amount" placeholder="Amount*" max="100000" rrequired>
                        </div>
                        <div class="col-md-12 col-sm-12 col-lg-12">
                            <select name="pay_method" id="" class="form-control" onchange="receiptShow(this.value)"
                                rrequired>
                                <option value disabled selected>Choose Donation Method*</option>
                                <option value="strip">Stripe(MasterCard, Visa, Google Pay,etc)</option>
                                <option value="receipt">Receipt</option>
                            </select>
                        </div>
                        <div class="col-md-12 col-sm-12 col-lg-12 d-none" id="receipt-div">

                            <input type="file" name="receipt" placeholder="Receipt Image" rrequired>
                            <small class="text-success">(Please upload receipt image*)</small>
                        </div>
                        <div class="col-md-12 col-sm-12 col-lg-12">
                            <textarea placeholder="Message"></textarea>
                            <button class="thm-btn brd-rd40" type="submit">Donate</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
@stop
@section('after-scripts')
<script>
    function receiptShow(val){
        // alert(val);
        if (val=="receipt") {
            $('#receipt-div').removeClass('d-none');
        }else{
            $('#receipt-div').addClass('d-none');
        }
    }
</script>
@endsection