{{-- IF USER PAYS ON EVENT ENTRY FEE  --}}

@if (auth()->check() && auth()->user()->getActiveSubscriptions && $plan?->plan_type === 'member' && $event)
    <label for="custom-made-check" class="event-fee-box grad-border">
        <div class="event-fee-box-inner">
            <div class="onetime-pay-box">
                <p>Host's Event Fee/ (one time)</p>
                <div class="netime-pay-money">
                    <h3>${{ $event->event_fee }}</h3>
                    <div class="custom-made-check"></div>
                    <input type="checkbox" name="" checked id="custom-made-check" class="d-none">
                </div>
            </div>
        </div>
    </label>
    <div class="subscription-card-box two-sec-card">
        <div class="sub-card-inner">
            <h4>Event Fee</h4>
            <div class="sub-card-prize">
                <h3>Hosted event</h3>

                <h4>${{ $event->event_fee }}</h4>
            </div>
            <div class="sub-total-data">
                <h3>Total</h3>
                <h2>${{ $event->event_fee }}</h2>
            </div>
        </div>
    </div>
    {{-- IF USER IS A RAF NEW MEMBER AND PAY FOR BOTH EVENT AND SUBSCRIPTION --}}

@elseif(($event && !auth()->check()) || (auth()->check() && !auth()->user()->getActiveSubscriptions && $event))
    <div class="subscription-card-box three-sec-card">
        <div class="sub-card-inner">
            @if ($plan->plan_type === 'member')
                <div class="sub-card-prize">
                    <h3>Host's Event Fee <span>(USD) / One Time</span></h3>
                    <h4>${{ $event->event_fee }}</h4>
                </div>
            @endif
            <div class="sub-card-prize raf-new-member-payment">
                <h3>{{ strtoupper($plan->name) }} <span>(USD) /
                        {{ getPlanTypeShowName($plan->time_type) }}</span>
                </h3>

                <h4>${{ $plan->price }}</h4>
            </div>
            @if ($plan->plan_type == 'host')
                <div class="sub-coupon-box">
                    <div class="sub-coupon-detials">
                        <h3>Discount Code</h3>
                        <span>if any</span>
                    </div>
                    <input type="text" class='sub-coupon-code' name='discount-coupan' id='discount-coupan'>
                    <input type="hidden" name='event_price' value="{{ $plan->price }}">
                    <button class="btn primary-btn coupon-apply-btn" type='button' id='apply-coupan'>Apply</button>
                    <button type='button' id='remove-coupan' class='d-none btn primary-btn'>Remove</button>
                </div>
            @endif
            <div class="sub-total-data">
                <h3>Total</h3>
                @if (auth()->user() && auth()->user()->hasRole('Host') && $plan->plan_type === 'host')
                    <h4 id="price-after-discount">${{ $plan->price }}</h4>
                @else
                    <h2>${{ number_format(getEventById($user->event_id)->event_fee + $plan->price, 2) }}
                    </h2>
                @endif
            </div>
        </div>
    </div>
    {{-- IF USER IS MEMBER AND PAYING FOR ONLY SUBSCRIPTION  || USER IS HOST AND PAYING ONLY FOR CREATING EVENT --}}
@else
    <div class="subscription-card-box card-less-info">
        <div class="sub-card-inner">
            @if ($plan->plan_type === 'host')
                <div class="sub-card-prize plan-set-box-outer host-paying-event">
                    <span class='d-inline'>Hosted event</span>
                    <div class="sub-card-prize-new">
                        <h3>{{ strtoupper(getPlanTypeShowName($plan->name)) }} (USD) /
                            Event
                        </h3>
                        <h4>${{ $plan->price }}</h4>
                    </div>
                </div>
            @else
                <div class="sub-card-prize only-subscription-pay">
                    <div class="sub-card-prize-new">
                        <h3>{{ strtoupper(getPlanTypeShowName($plan->name)) }} <span>(USD) /
                                {{ getPlanTypeShowName($plan->time_type) }} </span></h3>
                        <h4>${{ $plan->price }}</h4>
                    </div>
                </div>
            @endif

            {{-- DISCOUNT ONLY FOR HOST --}}
            @if ($plan->plan_type === 'host')
                <div class="sub-coupon-box">
                    <div class="sub-coupon-detials">
                        <h3>Discount Code</h3>
                        <span>if any</span>
                    </div>
                    {{-- <div class="sub-coupon-code"></div> --}}
                    <input type="text" class='sub-coupon-code' name='discount-coupan' id='discount-coupan'>
                    <input type="hidden" name='event_price' value="{{ $plan->price }}">
                    <button class="btn primary-btn" type='button' id='apply-coupan'>Apply</button>
                    <button type='button' id='remove-coupan' class='d-none btn primary-btn'>Remove</button>
                </div>
            @endif

            <div class="sub-total-data">
                <h3>Total</h3>
                <h2 id='price-after-discount'>${{ $plan->price }}</h2>
            </div>
        </div>
    </div>
@endif
{{-- functionality for discount coupan --}}
@if ($plan->plan_type === 'host')
    @push('scripts')
        <script>
            jQuery(document).ready(function() {
                // jQuery('#remove-coupan').addClass('d-none');

                let payNowBtnText = $('#payNow').clone()      // Clone the button element
                                            .children()                         // Select all child elements
                                            .remove()                           // Remove child elements from the clone
                                            .end()                              // Return to the cloned button
                                            .text().trim();
                
                let payByChoosenCardBtnText = $('#payByChoosenCard').clone()      // Clone the button element
                                            .children()                         // Select all child elements
                                            .remove()                           // Remove child elements from the clone
                                            .end()                              // Return to the cloned button
                                            .text().trim();
                                            
                let originalPrice = "{{ $plan->price }}";

                //disable apply button first time
                jQuery('#apply-coupan').attr('disabled', true);

                //enable button when input code have value
                jQuery('#discount-coupan').on('keyup', function(e) {
                    if (jQuery(this).val() != '') {
                        jQuery('#apply-coupan').attr('disabled', false);
                    } else {
                        jQuery('#apply-coupan').attr('disabled', true);
                    }
                });

                //bind pasted event
                jQuery('#discount-coupan').bind('paste', function(e) {
                    let pastedData = e.originalEvent.clipboardData.getData('text');
                    if (pastedData != '') {
                        jQuery('#apply-coupan').attr('disabled', false);
                    } else {
                        jQuery('#apply-coupan').attr('disabled', true);
                    }
                });




                //apply discount button functionality
                jQuery('#apply-coupan').click(function(event) {
                    //show full page loader
                    jQuery('#fullPageLoader').removeClass('d-none');

                    let coupanCode = jQuery('input[name="discount-coupan"]').val();
                    let eventPrice = jQuery('input[name="event_price"]').val();

                    let url = "{{ route('payment.discount.coupan') }}";

                    let data = {
                        coupan_code: coupanCode,
                        event_price: eventPrice
                    }

                    // jQuery(this).toggleClass('code-applied');


                    let response = ajaxCall(url, 'post', data);
                    response.then((data) => {
                        if (data.status == true) {
                            //change price and text according to code
                            // setTimeout(() => {
                                jQuery('#price-after-discount').text("$" + data.amount);

                                //append input to form to verify code is applied
                                let form = jQuery('#paymentForm');
                                let input = jQuery('<input>', {
                                    type: 'hidden',
                                    name: 'coupanCode',
                                    value: coupanCode , 
                                    'data-amount' : data.amount,
                                });

                                form.prepend(input);

                                //show hide buttons
                                jQuery('#apply-coupan').addClass('d-none');
                                jQuery('#remove-coupan').removeClass('d-none');

                                //showing elements dim when using card default
                                if(data.amount == 0.00){
                                    jQuery('.check-trigger').css('opacity' , '0.3');
                                    jQuery('.check-trigger').find('input').attr('disabled' , true);
                                    jQuery('#payNow').text('GET EVENT CODE');
                                    jQuery('#payByChoosenCard').text('GET EVENT CODE');
                                }
                                // jQuery('.check-trigger').find('input').s('disabled' , true);

                                setTimeout(() => {
                                    jQuery('#fullPageLoader').addClass('d-none');
                                }, 5000);
                            // }, 5000)
                        } else {
                            //remove coupan input
                            jQuery('input[name="coupanCode"]').remove();

                            //showing elements un-dim when using card default
                            jQuery('.check-trigger').css('opacity' , '1');
                            jQuery('.check-trigger').find('input').attr('disabled' , false);

                            //set originalprice
                            jQuery('#price-after-discount').text("$" + originalPrice);

                            jQuery('#payNow').text(payNowBtnText);
                            jQuery('#payByChoosenCard').text(payByChoosenCardBtnText);

                            //show hide buttons
                            jQuery('#apply-coupan').removeClass('d-none');
                            jQuery('#remove-coupan').addClass('d-none');

                            //hide fullpage loader
                            jQuery('#fullPageLoader').addClass('d-none');
                            errorShow('Unfortunately failed', data.message, 'Try again');
                        }
                    });
                });

                //remove coupan
                jQuery('#remove-coupan').click(function() {
                    //show fullpage loader
                    jQuery('#fullPageLoader').removeClass('d-none');

                    setTimeout(() => {
                        //remove input value
                        jQuery('#discount-coupan').val('');

                        //show hide buttons
                        jQuery(this).addClass('d-none');
                        jQuery('#apply-coupan').removeClass('d-none');

                        jQuery('#price-after-discount').text("$" + originalPrice);

                        //remove coupan input
                        jQuery('input[name="coupanCode"]').remove();

                        //showing elements un-dim when using card default
                        jQuery('.check-trigger').css('opacity' , '1');
                        jQuery('.check-trigger').find('input').attr('disabled' , false);

                        jQuery('#payNow').text(payNowBtnText);
                        jQuery('#payByChoosenCard').text(payByChoosenCardBtnText);

                        //hide fullpage loader
                        jQuery('#fullPageLoader').addClass('d-none');

                    }, 3000);
                });
            });
        </script>
    @endpush
@endif