@extends('layout.landing')
@section('title', 'Krojač Biznis | Podkasti')

@section('content')
<div class="page-wrapper">

    <!-- Header Account -->
    @include('front-inc._header-account')

    <!-- section main-container -->
    <section class="main-container">

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

                <!-- main-content -->
                <div class="main-content col-12">
                    <div class="row">
                        @foreach ($podcasts as $podcast)    
                            <!-- course-item -->
                            <div class="col-xl-4 col-lg-6">
                                <div class="course-item-box">
                                    <div class="course-item-image-holder">
                                        <a
                                            href="{{ route('lms.podcast.show', $podcast->id) }}"
                                            >
                                            @if ($podcast->blob && (strlen($podcast->blob->cover_image) > 0))
                                                <img src="{{ asset('storage/'.$podcast->blob->cover_image) }}" width="1200" height="630">
                                            @else
                                                <img src="https://placeimg.com/720/378/nature" width="1200" height="630">
                                            @endif
                                        </a>
                                    </div>
                                    <!-- course-item-image-holder end -->
                                    <div class="course-item-info">
                                        <div class="course-group">
                                            {{-- <a
                                                class="light-link"
                                                href="#"
                                                >
                                                Poslovni
                                            </a> --}}
                                            @if ($podcast->instructor) 
                                                <a
                                                    class="btn btn-link btn-teacher"
                                                    href="#"
                                                    >
                                                    {{ $podcast->instructor->getFullName() }}
                                                </a>
                                            @endif
                                        </div>
                                        <!-- course-group end -->
                                    </div>
                                    <!-- course-item-info end -->
                                    <h2>
                                        <a
                                            href="{{ route('lms.podcast.show', $podcast->id) }}"
                                            >
                                            {{ $podcast->title }}
                                        </a>
                                    </h2>
                                </div>
                                <!-- course-item-box end -->
                            </div>
                            <!-- course-item end -->
                        @endforeach
                    </div>
                    <!-- row end -->

                </div>
                <!-- main-content end -->

            </div>
            <!-- row end -->
        </div>
        <!-- container end -->

    </section>
    <!-- main-container end -->

    <!-- Footer -->
    @include('front-inc._footer')

</div>
<!--- page-wrapper end -->
@endsection

@section('add-scripts')
    @parent
    {{-- <script>
        const setPerPageElement = document.querySelectorAll('.selectShowItems');
        setPerPageElement.forEach((setPerPage) => {
            setPerPage.addEventListener('change', (e) => {
                const perPage = e.target.value;

                const params = route().params;
                params.page = 1;
                params.perPage = perPage;

                window.location = route(route().current(), params);
            });
        });
    </script> --}}
@endsection