@extends('layouts.appLayout')

@section('title', 'Public Discover')

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/discover.css') }}">
@endpush

@section('content')

    <div class="container my-5">

        <div class="row mb-4">
            <div class="col-12 text-center">
                <h1 class="text-white fw-bold">Discover</h1>
                @if ($mostLiked->isNotEmpty())
                    <span class="textOrange">Most Liked</span>
                @endif
            </div>
        </div>

        @if ($mostLiked->isNotEmpty())
            <div class="row">
                @foreach($mostLiked as $course)
                    <div class="col-md-3 mb-4" style="width: 20%">
                        <div class="card h-100">
                            <div class="card-body card-body-course">

                                {{-- Imagen --}}
                                <p class="card-text card-img">
                                    <img src="{{ asset('img/coverIMG/cover' . $course->id . '.jpg') }}"
                                        alt="Course Cover"
                                        class="imgCourse">
                                </p>

                                {{-- Título --}}
                                <h5 class="card-title padding-card">{{ $course->title }}</h5>

                                {{-- Atributos --}}
                                <ul class="list-unstyled padding-card mb-2">
                                    @if($course->subcategory?->category?->name)
                                        <li><strong>Category:</strong> {{ $course->subcategory->category->name }}</li>
                                    @endif
                                    @if($course->subcategory?->name)
                                        <li><strong>Subcategory:</strong> {{ $course->subcategory->name }}</li>
                                    @endif
                                    <li><strong>Type:</strong> {{ ucfirst($course->type) }}</li>
                                    <li><strong>Price:</strong> {{ number_format($course->price, 2) }}€</li>
                                    @if($course->published_date)
                                        <li><strong>Published:</strong> {{ \Carbon\Carbon::parse($course->published_date)->format('d/m/Y') }}</li>
                                    @endif
                                </ul>

                            </div>
                            <div class="card-footer">
                                <a href="{{ url('/course/info/' . $course->id) }}" class="btn btn1 btn-custom-purple mx-0 w-100">
                                    View Course
                                </a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>

        @endif

        <br><br>

        @if ($mostBought->isNotEmpty())

            <div class="row mb-4">
                <div class="col-12 text-center">
                    <h1 class="textOrange fw-bold">Most Bought</h1>
                </div>
            </div>

            <div class="row">
                @foreach($mostBought as $course)
                    <div class="col-md-3 mb-4" style="width: 20%">
                        <div class="card h-100">
                            <div class="card-body card-body-course">

                                {{-- Imagen --}}
                                <p class="card-text card-img">
                                    <img src="{{ asset('img/coverIMG/cover' . $course->id . '.jpg') }}"
                                        alt="Course Cover"
                                        class="imgCourse">
                                </p>

                                {{-- Título --}}
                                <h5 class="card-title padding-card">{{ $course->title }}</h5>

                                {{-- Atributos --}}
                                <ul class="list-unstyled padding-card mb-2">
                                    @if($course->subcategory?->category?->name)
                                        <li><strong>Category:</strong> {{ $course->subcategory->category->name }}</li>
                                    @endif
                                    @if($course->subcategory?->name)
                                        <li><strong>Subcategory:</strong> {{ $course->subcategory->name }}</li>
                                    @endif
                                    <li><strong>Type:</strong> {{ ucfirst($course->type) }}</li>
                                    <li><strong>Price:</strong> {{ number_format($course->price, 2) }}€</li>
                                    @if($course->published_date)
                                        <li><strong>Published:</strong> {{ \Carbon\Carbon::parse($course->published_date)->format('d/m/Y') }}</li>
                                    @endif
                                </ul>

                            </div>
                            <div class="card-footer">
                                <a href="{{ url('/course/info/' . $course->id) }}" class="btn btn1 btn-custom-purple mx-0 w-100">
                                    View Course
                                </a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>

        @endif

        <br><br>

        @if ($mostUsed->isNotEmpty())

            <div class="row mb-4">
                <div class="col-12 text-center">
                    <h1 class="textOrange fw-bold">Most Used</h1>
                </div>
            </div>

            <div class="row">
                @foreach($mostUsed as $course)
                    <div class="col-md-3 mb-4" style="width: 20%">
                        <div class="card h-100">
                            <div class="card-body card-body-course">

                                {{-- Imagen --}}
                                <p class="card-text card-img">
                                    <img src="{{ asset('img/coverIMG/cover' . $course->id . '.jpg') }}"
                                        alt="Course Cover"
                                        class="imgCourse">
                                </p>

                                {{-- Título --}}
                                <h5 class="card-title padding-card">{{ $course->title }}</h5>

                                {{-- Atributos --}}
                                <ul class="list-unstyled padding-card mb-2">
                                    @if($course->subcategory?->category?->name)
                                        <li><strong>Category:</strong> {{ $course->subcategory->category->name }}</li>
                                    @endif
                                    @if($course->subcategory?->name)
                                        <li><strong>Subcategory:</strong> {{ $course->subcategory->name }}</li>
                                    @endif
                                    <li><strong>Type:</strong> {{ ucfirst($course->type) }}</li>
                                    <li><strong>Price:</strong> {{ number_format($course->price, 2) }}€</li>
                                    @if($course->published_date)
                                        <li><strong>Published:</strong> {{ \Carbon\Carbon::parse($course->published_date)->format('d/m/Y') }}</li>
                                    @endif
                                </ul>

                            </div>
                            <div class="card-footer">
                                <a href="{{ url('/course/info/' . $course->id) }}" class="btn btn1 btn-custom-purple mx-0 w-100">
                                    View Course
                                </a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>

        @endif

    </div>

@endsection