@php
use App\FinanceModel;
$finance_modelInstance = new FinanceModel();
use App\MasterModel;
$master_instance = new MasterModel();
use App\registerModel;
$register_instance = new registerModel();
$user = Session::get('user');
$userid=$user->id;
$user_data = $finance_modelInstance->user_data($userid);
$plan_id=$user_data->plan_id;
use App\DashboardModel;
$session_id = session()->get('session_id');
$member_data_instance = new DashboardModel();
$member_sidebar_data = $member_data_instance->get_member_data($session_id);
$sub_type_data = $finance_modelInstance->subscription_type($plan_id);
$sub_type=$sub_type_data->profile_type;
$publish_key = $finance_modelInstance->secret_key();
@endphp
@include('frontend.include.header')

<style>
    .nav-text {
        max-width: 913px;
        margin: 0 auto;
        margin-top: 15px;
    }
</style>

<!--Register-section-->
<section>
    <div class="bannerimg cover-image bg-background3" data-image-src="../assets/images/banners/banner2.jpg">
        <div class="header-text mb-0">
            <div class="container">
                <div class="text-center text-white " align="center">
                    <h1 class="">Join the only comprehensive online Directory for Structural Integration Worldwide.
                    </h1>
                </div>
            </div>
        </div>
    </div>

</section>
<section class="sptb">
    <div class="container">
        <div class="row">
            <div class="col-xl-3 col-lg-12 col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">My Dashboard</h3>
                    </div>

                    <div class="card-body text-center item-user border-bottom">
                        <div class="profile-pic">
                            <div class="profile-pic-img">
                                @if(@$member_sidebar_data->profile_logo != NULL && @file_get_contents(url('/')."/public/uploads/display/".$member_sidebar_data->profile_logo))
                                <img src="{{url('/')}}{{'/public/uploads/display'}}{{'/'}}{{@$member_sidebar_data->profile_logo}}" class="brround" alt="user">
                                @elseif(@$member_sidebar_data->profile_photo != NULL && @file_get_contents(url('/')."/public/uploads/display/".$member_sidebar_data->profile_photo))
                                <img src="{{url('/')}}{{'/public/uploads/display'}}{{'/'}}{{@$member_sidebar_data->profile_photo}}" class="brround" alt="user">

                                @else
                                <img src="{{url('/')}}{{'/public/uploads/no_image.jpg'}}" class="brround" alt="user">
                                @endif

                            </div>
                            <a href="{{url('/')}}/{{$member_sidebar_data->filename}}" class="text-dark">
                                <h4 class="mt-3 mb-0 font-weight-semibold">{{@$member_sidebar_data->first_name.' '.@$member_sidebar_data->last_name}}</h4>
                            </a>
                            <span class="module center-block fpad member-account-information text-center bmargin no-radius-top" style="padding-top:5px;">
                                <span class="memberacctid"> Member ID #{{@$member_sidebar_data->user_id}}</span><br>
                                @php
                                $plan_level = $member_data_instance->get_plan_level(@$member_sidebar_data->plan_id)
                                @endphp
                                <span class="small member-level-name">Level: {{ucfirst(strtolower(@$plan_level->subscription_name))}}
                                </span>
                        </div>
                    </div>
                    <div class="item1-links  mb-0">
                        <a href="{{url('/')}}/accounts/dashboard" class="active d-flex border-bottom">
                            <span class="icon1 mr-3"><i class="fa fa-home"></i></span> <strong>Dashboard</strong>
                        </a>
                        <a href="{{url('/')}}/accounts/manage-leads" class="d-flex border-bottom">
                            <span class="icon1 mr-3"><i class="fa fa-envelope"></i></span> <strong>Manage Leads</strong>
                        </a>
                         <a href="{{url('/')}}/accounts/addplans" class="d-flex border-bottom">
                            <span class="icon1 mr-3"><i class="fa fa-credit-card"></i></span> <strong>Plans</strong>
                        </a>
                        <a href="{{url('/')}}/accounts/manage-reviews" class="d-flex  border-bottom">
                            <span class="icon1 mr-3"><i class="fa fa-star"></i></span> <strong>Managed Reviews</strong>
                        </a>
                        <!--
                            -------------- Starts Accordian and sub menu for manage Profile ----------------
                        -->
                        <div class="accordion" id="accordionExample">
                            <div id="headingOne">
                                <h2 class="mb-0">
                                    <a class=" d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseOne">
                                        <span class="icon1 mr-3"><i class="fa fa-user"></i></span> <strong>Manage Profile</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
                                <div>
                                    <a href="{{url('/')}}/accounts/contact-detail" class="list-group-item"> - Contact Details</a>
                                    <a href="{{url('/')}}/accounts/profile-photo" class="list-group-item"> - Profile Photo</a>
                                    <a href="{{url('/')}}/accounts/listing-detail" class="list-group-item"> - Listing Details</a>
                                    <a href="{{url('/')}}/accounts/about" class="list-group-item"> - About</a>
                                    {{-- <a href="{{url('/')}}/accounts/service-areas" class="list-group-item"> - Service Areas</a> --}}
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for manage Profile ----------------
                        -->

                        <!--
                            -------------- Starts Accordian and sub menu for My Favourite ----------------
                        -->
                        <div class="accordion" id="favourite">
                            <div id="headingTwo">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseTwo">
                                        <span class="icon1 mr-3"><i class="fa fa-heart"></i></span> <strong>My Favourite</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#favourite">
                                <div>
                                    <a href="{{url('/')}}/accounts/favorite-classified" class="list-group-item"> - Classifieds</a>
                                    <a href="{{url('/')}}/accounts/favorite-properties" class="list-group-item"> - Properties</a>
                                    <a href="{{url('/')}}/accounts/favorite-product" class="list-group-item"> - Classified products</a>
                                    <a href="{{url('/')}}/accounts/favorite-events" class="list-group-item"> - Events</a>
                                    <a href="{{url('/')}}/accounts/favorite-coupons" class="list-group-item"> - Coupons</a>
                                    <a href="{{url('/')}}/accounts/favorite-jobs" class="list-group-item"> - Jobs</a>
                                    <a href="{{url('/')}}/accounts/favorite-blogs" class="list-group-item"> - Blogs</a>
                                    <a href="{{url('/')}}/accounts/favorite-photos" class="list-group-item"> - Photo Galleries</a>
                                    <a href="{{url('/')}}/accounts/favorite-videos" class="list-group-item"> - Videos</a>
                                    <a href="{{url('/')}}/accounts/favorite-audios" class="list-group-item"> - Audios</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for My favourite ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for Classified ----------------
                        -->
                        <div class="accordion" id="classified">
                            <div id="headingThree">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseThree">
                                        <span class="icon1 mr-3"><i class="fa fa-thumb-tack"></i></span> <strong>Classifieds</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#classified">
                                <div>
                                    <a href="{{url('/')}}/accounts/classified/add" class="list-group-item"> - Add Classifieds</a>
                                    <a href="{{url('/')}}/accounts/classified/view" class="list-group-item"> - View Classifieds</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Classified ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for Blog Article ----------------
                        -->
                        <div class="accordion" id="blog">
                            <div id="headingFour">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseFour">
                                        <span class="icon1 mr-3"><i class="fa fa-file-text"></i></span> <strong>Manage Blog</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#blog">
                                <div>
                                    <a href="{{url('/')}}/accounts/blog/add" class="list-group-item"> - Add Blog</a>
                                    <a href="{{url('/')}}/accounts/blog/view" class="list-group-item"> - View Blog</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Blog Article ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for Events ----------------
                        -->
                        <div class="accordion" id="events">
                            <div id="headingFive">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseFive">
                                        <span class="icon1 mr-3"><i class="fa fa-calendar"></i></span> <strong>Events</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#events">
                                <div>
                                    <a href="{{url('/')}}/accounts/events/add" class="list-group-item"> - Add Events</a>
                                    <a href="{{url('/')}}/accounts/events/view" class="list-group-item"> - View Events</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Events ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for Property ----------------
                        -->
                        <div class="accordion" id="Property">
                            <div id="headingSeven">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseSeven">
                                        <span class="icon1 mr-3"><i class="fa fa-home"></i></span> <strong>Properties</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#Property">
                                <div>
                                    <a href="{{url('/')}}/accounts/properties/add" class="list-group-item"> - Add Properties</a>
                                    <a href="{{url('/')}}/accounts/properties/view" class="list-group-item"> - View Properties</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Classfied Property ----------------
                        -->

                        <!--
                            -------------- Starts Accordian and sub menu for Media/Galleries ----------------
                        -->
                        <div class="accordion" id="media">
                            <div id="headingEight">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseEight">
                                        <span class="icon1 mr-3"><i class="fa fa-camera-retro" aria-hidden="true"></i></span> <strong>Media</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#media">
                                <div>
                                    <a href="{{url('/')}}/accounts/photo-albums/add" class="list-group-item"> - Photo Galleries</a>
                                    <a href="{{url('/')}}/accounts/video/add" class="list-group-item"> - Videos</a>
                                    <a href="{{url('/')}}/accounts/audio/add" class="list-group-item"> - Soundcloud Audios</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Media/Galleries ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for job ----------------
                        -->
                        <div class="accordion" id="Job">
                            <div id="headingNine">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseNine">
                                        <span class="icon1 mr-3"><i class="fa fa-tasks"></i></span> <strong>Jobs</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#Job">
                                <div>
                                    <a href="{{url('/')}}/accounts/jobs/add" class="list-group-item"> - Add Jobs</a>
                                    <a href="{{url('/')}}/accounts/jobs/view" class="list-group-item"> - View Jobs</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Job ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for Coupons ----------------
                        -->
                        <div class="accordion" id="Coupon">
                            <div id="headingTen">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseTen">
                                        <span class="icon1 mr-3"><i class="fa fa-tag"></i></span> <strong>Coupons</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseTen" class="collapse" aria-labelledby="headingTen" data-parent="#Coupon">
                                <div>
                                    <a href="{{url('/')}}/accounts/coupons/add" class="list-group-item"> - Add Coupons</a>
                                    <a href="{{url('/')}}/accounts/coupons/view" class="list-group-item"> - View Coupons</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Coupons ----------------
                        -->
                        <!--
                            -------------- Starts Accordian and sub menu for Classified Product----------------
                        -->
                        <div class="accordion" id="Product">
                            <div id="headingEleven">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseEleven">
                                        <span class="icon1 mr-3"><i class="fa fa-cube" aria-hidden="true"></i></span> <strong>Classified Product</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#Product">
                                <div>
                                    <a href="{{url('/')}}/accounts/products/add" class="list-group-item"> - Add Product</a>
                                    <a href="{{url('/')}}/accounts/products/view" class="list-group-item"> - View Product</a>
                                </div>
                            </div>
                        </div>
                        <!-------------- End Accordian and sub menu for Classified Product --------------->

                        <!--
                            -------------- Starts Accordian and sub menu for Settings/Account setup details ----------------
                        -->
                        <div class="accordion" id="setting">
                            <div id="headingTwelve">
                                <h2 class="mb-0">
                                    <a class="d-flex border-bottom" style="cursor:pointer;" data-toggle="collapse" data-target="#collapseTwelve">
                                        <span class="icon1 mr-3"><i class="fa fa-cogs" aria-hidden="true"></i></span> <strong>Settings</strong> <i class="pull-right fa fa-caret-down"></i>
                                    </a>
                                </h2>
                            </div>
                            <div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#setting">
                                <div>
                                    <a href="{{url('/')}}/accounts/billing-details" class="list-group-item"> - Billing Details</a>
                                    <a href="{{url('/')}}/accounts/password" class="list-group-item"> - Change Password</a>
                                    <a href="{{url('/')}}/accounts/contact" class="list-group-item"> - Contact Us</a>
                                </div>
                            </div>
                        </div>
                        <!--
                            -------------- End Accordian and sub menu for Settings ----------------
                        -->
                        <a href="{{url('/')}}/user-logout" class="d-flex">
                            <span class="icon1 mr-3"><i class="si si-power"></i></span> <strong> Logout </strong>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-xl-9 col-lg-12 col-md-12" style="margin: 0 auto;">
                <div class="card" style="background-color:#6963ff;color:#ffff">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-9">
                                <h3 class="card-title">Current Plan/{{ucfirst(strtolower(@$plan_level->subscription_name))}}</h3>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- <div class="card" style="background-color:#6963ff;color:#ffff">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-9">
                                <h3 class="card-title">Upgrade or Downgrade?</h3>
                            </div>
                        </div>
                    </div>
                </div> --}}
                <div class="text-center">
                    <div class="card-body items-gallery" style="margin:0;padding:0">
                        <div class="items-blog-tab text-center">
                            <div class="tab-content">
                                <div class="row">
                                    @foreach ($sub_Plan_list as $res_Plan_list)
                                    @if($plan_id!=$res_Plan_list->subscription_id && $res_Plan_list->subscription_id==1||  $res_Plan_list->subscription_id==10|| $res_Plan_list->subscription_id==11||
                                     $res_Plan_list->subscription_id==15|| $res_Plan_list->subscription_id==16)
                                
                                    <div class="col-md-4  m-0 p-0">
                                        <div class="scrollable-card" style="padding-right:10px;">
                                            <div class="panel price panel-color card overflow-hidden">
                                                @php
                                                $currency = $register_instance->display_currency($res_Plan_list->currency_type);
                                                @endphp
                                                <div class="panel-body text-center" style="background-color:#6963ff;color:#ffff">
                                                    <div class="row">
                                                        <div class="col-md-2 m-0 p-0 mt-1">
                                                            <label>
                                                                <input type="radio" name="subscription_choice" value="{{ $res_Plan_list->subscription_id }}">
                                                                <input type="hidden" name="email" value="{{ $user_data->email }}">
                                                            </label>
                                                        </div>
                                                        <div class="col-md-10" style="padding-right:49px;">
                                                           <span style="font-size: 12px; word-wrap: break-word;" class="subscription-name">{{ @$res_Plan_list->subscription_name }}</span>

                                                        </div>
                                                    </div>
                                                </div>

                                                <input type="hidden" name="currency_type" value="{{ $res_Plan_list->currency_type }}">

                                                <ul class="list-group list-group-flush text-center"  style="height: 178px; overflow-y: scroll;">
                                                    @php
                                                    $featured_data = [];
                                                    $featured_data = unserialize($res_Plan_list->new_features);
                                                    @endphp
                                                    @if (is_array($featured_data))
                                                    @foreach ($featured_data as $key => $val)
                                                    @if ($featured_data != '')
                                                    <li class="list-group-item"><span class="font-weight-semibold">{{ $val }}</span>
                                                    </li>
                                                    @else
                                                    <li class="list-group-item"><span class="font-weight-semibold">No features</span>
                                                    </li>
                                                    @endif
                                                    @endforeach
                                                    @endif
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    @endif
                                    @endforeach
                                </div>
                            </div>
                        </div>
                        <form id="subscriptionForm" action="" method="post">
                            @csrf
                            @if($sub_type=='free')
                            <!-- <button id="submitBtn" type="button" class="btn btn-primary btn-lg btn-block"
                                 data-toggle="modal" data-target="#exampleModalCenter">Upgrade Your Plan</button> -->

                            <button type="button" id="submit_btn" class="btn btn-primary btn-lg btn-block" data-toggle="modal" onclick="modal_Form()">
                                Save Plan
                            </button>
                            @else
                            <button id="submitBtn" type="button" class="btn btn-primary btn-lg btn-block" onclick="submitForm()">
                                Save Plan</button>
                            @endif
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

</section>

            <form id="payment-form" action="" method="post">
              <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle"
                aria-hidden="true" style="height:fit-content;top: 10%; transform: translateY(-20%);">
                <div class="modal-dialog modal-dialog-centered" role="document">
                  <div class="modal-content">
                    <div class="modal-header">
                      <h5 class="modal-title" id="exampleModalLongTitle" style="color:white;">Enter Your Card Details</h5>
                      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                      </button>
                    </div>
                    <div class="modal-body">
                      <div class="form-group">
                        <div class="card-body">
                          <div id="card-element">
                            <div id="card-errors" role="alert"></div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="modal-footer">
                      <button type="button" class="btn btn-primary" onclick="submit_modal_Form()">Submit</button>
                    </div>
                  </div>
                </div>
              </div>
            </form>
            
  <script src="https://js.stripe.com/v3/"></script>
  <script>
    var style = {
      base: {
        color: '#32325d',
        lineHeight: '18px',
        fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
        fontSmoothing: 'antialiased',
        fontSize: '16px',
        width: '500px',
        '::placeholder': {
          color: '#aab7c4'
        }
      },
      invalid: {
        color: '#fa755a',
        iconColor: '#fa755a'
      }
    };

    const stripe = Stripe('{{ $publish_key->key_code }}', { locale: 'en' });
    const elements = stripe.elements();
    const cardElement = elements.create('card', { style: style });
    cardElement.mount('#card-element');

    cardElement.addEventListener('change', function (event) {
      var displayError = document.getElementById('card-errors');
      if (event.error) {
        displayError.textContent = event.error.message;
      } else {
        displayError.textContent = '';
      }
    });
    
  </script>
</body>

</html>
<br>
<script>
    function submitForm()
    {
        var selectedValue = document.querySelector('input[name="subscription_choice"]:checked');

        if (selectedValue) 
        {
            var selectedSubscription = selectedValue.value;
            var emailValue = document.querySelector('input[name="email"]').value;
            var subscriptionId = ;
            var actionUrl = "{{ route('end_subscription', ['register_id' => ':subscriptionId']) }}";
            actionUrl = actionUrl.replace(':subscriptionId', subscriptionId);
            actionUrl += '?subscription=' + selectedSubscription + '&email=' + emailValue;
            document.getElementById("subscriptionForm").action = actionUrl;
            document.getElementById("subscriptionForm").submit();
        } 
        else 
        {
            alert("Please select a subscription before submitting.");
        }
    }
    
    function modal_Form() 
    {
        var selectedValue = document.querySelector('input[name="subscription_choice"]:checked');

        if (selectedValue) 
        {
            $('#exampleModalCenter').modal('show');
            
        }
        else
        {
                alert("Please select a subscription before submitting.");
            }
    }
    
    function submit_modal_Form() 
    {
        stripe.createPaymentMethod({
            type: 'card',
            card: cardElement,
        }).then(function(result) {
            if (result.error) {
                var displayError = document.getElementById('card-errors');
                displayError.textContent = result.error.message;
            } else {
                var paymentMethod = result.paymentMethod;
                var paymentMethodId = paymentMethod.id;
                var selectedValue = document.querySelector('input[name="subscription_choice"]:checked');
                var selectedSubscription = selectedValue.value;
                var emailValue = document.querySelector('input[name="email"]').value;
                var subscriptionId = ;
                var actionUrl = "{{ route('start_subscription', ['register_id' => ':subscriptionId']) }}";
                actionUrl = actionUrl.replace(':subscriptionId', subscriptionId);
                actionUrl += '?subscription=' + selectedSubscription + '&email=' + emailValue + '&paymentMethod=' + paymentMethodId;
                document.getElementById("subscriptionForm").action = actionUrl;
                document.getElementById("subscriptionForm").submit();
            }
        });
    }



</script>
<!--<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>-->
<!--<script>-->
<!--    $(document).ready(function() {-->
<!--        $('.subscription-name').each(function() {-->
<!--            var subscriptionName = $(this).text();-->
<!--            var characterLimit = 12;-->

<!--            if (subscriptionName.length > characterLimit) {-->
<!--                var truncatedText = subscriptionName.substring(0, characterLimit) + '...';-->
<!--                $(this).text(truncatedText);-->
<!--            }-->
<!--        });-->
<!--    });-->
<!--</script>-->


@include('frontend.include.footer')